【问题标题】:"Uncaught SyntaxError: Unexpected identifier" error in jquery [closed]jquery中的“未捕获的SyntaxError:意外的标识符”错误[关闭]
【发布时间】:2012-06-02 03:26:41
【问题描述】:

我正在制作一个用于在页面上绘制线条的新 jQuery 插件。 问题是我无法弄清楚这里发生了什么,当我运行脚本时,在 Chrome 中它说:

"Uncaught SyntaxError: Unexpected identifier"

第 8 行到最后一行(显示为:$.line();)。

整个代码:

(function( $ ) {

    $.fn.line = function(coordinates) {

        var bothpoints;

        $.fn.line.draw = function() {

            var lineColor = $('#lineRegion').attr('lineColor');

            if (!lineColor) {
                var colors = ['black', 'blue', 'green', 'red', 'yellow', 'purple', 'magenta', 'cyan'];

                $('img.line').each(function () {
                    colors.splice(colors.indexOf($(this).css('color')), 1);
                });

                var lineColor = colors[0];

            }

            var data = $.line.data(),
                width = Math.abs(data[0] - data[2]),
                height = Math.abs(data[1] - data[3]);
            if (data[0] >> data[2]) {
                var lineleft = data[2];
            } else {
                var lineleft = data[0];
            }
            if (data[1] >> data[3]) {
                var linetop = data[1];
            } else {
                var linetop = data[3];
            }

            $('body').append('<img class="line" src="/lines/line-'+lineColor+'.png" style="position:absolute;top:'+linetop+';left:'+lineleft+';width:'+width+'px;height:'+height+'px;color:'+lineColor+';"/>');
        }

        $.fn.line.data = function(coords) {
            if (coords.length == 2) {
                if ( ! $('#line').data('point1') ) { 
                    $('#line').data('point1', {x: coords[0], y: coords[1]});
                    bothpoints = false;
                } else {
                    $('#line').data('point2', {x: coords[0], y: coords[1]});
                    bothpoints = true;
                }
                $.line.draw();
            } else if (coords == 1) {
                $('#line').data('point1', false);
                bothpoints = false;
            } else if (coords == 2) {
                $('#line').data('point2', false);
                bothpoints = false;
            } else if (!coords) {
                return [$('#line').data('point1').x, $('#line').data('point1').y, $('#line').data('point2').x, $('#line').data('point2').y];
            }
        }

        $.fn.line.point = function() {
            if (!($.line.data().length == 4)) {
                var _posY = posy, _posX = posx;
                $('body').append('<div class="point" style="position:absolute; top:' + _posY + 'px; left:' + _posX + 'px;"></div>');
                $.line.data([_posX, _posY]);
                if (bothpoints == true) {
                    $.line.draw();
                }
            }
        }

        $.fn.line.unpoint = function() {
            this.hide('fast');
            if ($.line.data()[0] == this.offset()['left'] && $.line.data[1] == this.offset()['top']) {
                $.line.data(1);
            } else {
                $.line.data(2);
            }
            $.line.erase();
        }


        $.fn.line.erase = function(total) {
            if (total == true) {
                $('img.line').hide('fast');
                $('div.point').hide('fast');
                $.line.data(1);
                $.line.data(2);
            } else {
                $('img.line').hide('fast');
            }
        }

        if ( coordinates.length == 4) {
            $.line.data([coordinates[0], coordinates[1]]);
            $.line.data([coordinates[2], coordinates[3]]);
            $.line.draw();
        }

    };

    var posx, posy;

    $(document).ready(function(){
        $(document).on('mousemove', function(e) {
            if (!e) var e = window.event;
            if (e.pageX || e.pageY)     {
                posx = e.pageX;
                posy = e.pageY;
            }
            else if (e.clientX || e.clientY)    {
                posx = e.clientX + document.body.scrollLeft
                    + document.documentElement.scrollLeft;
                posy = e.clientY + document.body.scrollTop
                    + document.documentElement.scrollTop;
            }
        }
        $.line();
        $('head').append('<meta id="line" />');
        $('#lineRegion').click( $.line.point() );
        $('.point').click( $.line.unpoint() );
        $('.lineEraser').click( $.line.erase(true) );
    }

})( jQuery );

【问题讨论】:

  • 要检测这种简单的编码错误,请尝试使用 JSHint/JSLint。它们通常会提供更明智的错误消息,让您接受更好的编码实践。
  • @ssg - JSLint 对 IMO 过于严格,“缺少分号。” :/
  • @Derek JSLint 设置可以调整,JSHint 比 JSLint 更接地气。然而,“缺少分号”很重要,因为 JavaScript 中的“自动分号插入”会导致严重的错误,而不会在您错过一个错误时引发错误。我强烈建议保留该选项。

标签: javascript jquery plugins syntax-error


【解决方案1】:

您启动了一个内联函数:$(document).on('mousemove', function(e) {,但永远不会完成它后面的语句。在出现错误的行之前,您需要}); 而不仅仅是}

【讨论】:

  • 有时就是这么简单。我不敢相信我忽略了这一点。非常感谢!
  • 现在最后一行是"Unexpected token )"
  • 看起来最后一行之前的行也是同样的问题。您需要关闭document.ready 呼叫。
  • @TLS - 现在显示:"Uncaught TypeError: Object function (a,b){return new e.fn.init(a,b,h)} has no method 'line'"
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2013-09-19
  • 1970-01-01
  • 2018-12-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多