Question

我在找到一个脚本会出现问题时遇到问题。我在FireBug中遇到以下错误：

未捕获的异常：语法错误，无法识别的表达：）

问题是在我的base.js中以某种方式引起的，猜测可排序函数不想使用我的jQuery版本。请看下面的演示：

http://dev.evilmile.de/CommandCP/

base.js上的第656行：我使用了inettuts脚本，基本上克隆了iGoogles接口。该脚本使我可以对窗口小部件进行排序，隐藏/显示内容并更改每个窗口小部件的颜色，还可以将所有内容保存在cookie中以记住位置和样式。最初，inettuts脚本与jQuery 1.2.6和UI 1.6.2一起运行，我在jQuery 1.4.2和UI 1.8.1，有什么问题。除了可排序函数之外，所有函数都在该组合中运行良好，我没有任何运动等。

var iNettuts = {

jQuery : $,

settings : {
    columns : '.column',
    widgetSelector: '.widget',
    handleSelector: '.widget-head',
    contentSelector: '.widget-content',

    /* If you don't want preferences to be saved change this value to
        false, otherwise change it to the name of the cookie: */
    saveToCookie: 'widget-prefs22222',

    widgetDefault : {
        movable: true,
        removable: true,
        collapsible: true,
        editable: true,
        colorClasses : ['color-yellow', 'color-red', 'color-blue', 'color-white', 'color-orange', 'color-green']
    },
    widgetIndividual : {}
},

init : function () {
    this.attachStylesheet('css/inettuts.js.css');
    this.sortWidgets();
    this.addWidgetControls();
    this.makeSortable();
},

getWidgetSettings : function (id) {
    var $ = this.jQuery,
        settings = this.settings;
    return (id&&settings.widgetIndividual[id]) ? $.extend({},settings.widgetDefault,settings.widgetIndividual[id]) : settings.widgetDefault;
},

addWidgetControls : function () {
    var iNettuts = this,
        $ = this.jQuery,
        settings = this.settings;

    $(settings.widgetSelector, $(settings.columns)).each(function () {
        var thisWidgetSettings = iNettuts.getWidgetSettings(this.id);
        if (thisWidgetSettings.removable) {
            $('<a href="#" class="remove">CLOSE</a>').mousedown(function (e) {
                /* STOP event bubbling */
                e.stopPropagation();    
            }).click(function () {
                if(confirm('This widget will be removed, ok?')) {
                    $(this).parents(settings.widgetSelector).animate({
                        opacity: 0    
                    },function () {
                        $(this).wrap('<div/>').parent().slideUp(function () {
                            $(this).remove();
                        });
                    });
                }
                return false;
            }).appendTo($(settings.handleSelector, this));
        }

        if (thisWidgetSettings.editable) {
            $('<a href="#" class="edit">EDIT</a>').mousedown(function (e) {
                /* STOP event bubbling */
                e.stopPropagation();    
            }).toggle(function () {
                $(this).css({backgroundPosition: '-66px 0', width: '55px'})
                    .parents(settings.widgetSelector)
                        .find('.edit-box').show().find('input').focus();
                return false;
            },function () {
                $(this).css({backgroundPosition: '', width: '24px'})
                    .parents(settings.widgetSelector)
                        .find('.edit-box').hide();
                return false;
            }).appendTo($(settings.handleSelector,this));
            $('<div class="edit-box" style="display:none;"/>')
                .append('<ul><li class="item"><label>Change the title?</label><input value="' + $('h3',this).text() + '"/></li>')
                .append((function(){
                    var colorList = '<li class="item"><label>Available colors:</label><ul class="colors">';
                    $(thisWidgetSettings.colorClasses).each(function () {
                        colorList += '<li class="' + this + '"/>';
                    });
                    return colorList + '</ul>';
                })())
                .append('</ul>')
                .insertAfter($(settings.handleSelector,this));
        }

        if (thisWidgetSettings.collapsible) {
            $('<a href="#" class="collapse">COLLAPSE</a>').mousedown(function (e) {
                /* STOP event bubbling */
                e.stopPropagation();    
            }).click(function(){
                $(this).parents(settings.widgetSelector).toggleClass('collapsed');
                /* Save prefs to cookie: */
                iNettuts.savePreferences();
                return false;    
            }).prependTo($(settings.handleSelector,this));
        }
    });

    $('.edit-box').each(function () {
        $('input',this).keyup(function () {
            $(this).parents(settings.widgetSelector).find('h3').text( $(this).val().length>20 ? $(this).val().substr(0,20)+'...' : $(this).val() );
            iNettuts.savePreferences();
        });
        $('ul.colors li',this).click(function () {

            var colorStylePattern = /\bcolor-[\w]{1,}\b/,
                thisWidgetColorClass = $(this).parents(settings.widgetSelector).attr('class').match(colorStylePattern)
            if (thisWidgetColorClass) {
                $(this).parents(settings.widgetSelector)
                    .removeClass(thisWidgetColorClass[0])
                    .addClass($(this).attr('class').match(colorStylePattern)[0]);
                /* Save prefs to cookie: */
                iNettuts.savePreferences();
            }
            return false;

        });
    });

},

attachStylesheet : function (href) {
    var $ = this.jQuery;
    return $('<link href="' + href + '" rel="stylesheet" type="text/css" />').appendTo('head');
},

makeSortable : function () {
    var iNettuts = this,
        $ = this.jQuery,
        settings = this.settings,
        $sortableItems = (function () {
            var notSortable = '';
            $(settings.widgetSelector,$(settings.columns)).each(function (i) {
                if (!iNettuts.getWidgetSettings(this.id).movable) {
                    if(!this.id) {
                        this.id = 'widget-no-id-' + i;
                    }
                    notSortable += '#' + this.id + ',';
                }
            });
            return $('> li:not(' + notSortable + ')', settings.columns);
        })();

    $sortableItems.find(settings.handleSelector).css({
        cursor: 'move'
    }).mousedown(function (e) {
        $sortableItems.css({width:''});
        $(this).parent().css({
            width: $(this).parent().width() + 'px'
        });
    }).mouseup(function () {
        if(!$(this).parent().hasClass('dragging')) {
            $(this).parent().css({width:''});
        } else {
            $(settings.columns).sortable('disable');
        }
    });

    $(settings.columns).sortable({
        items: $sortableItems,
        connectWith: $(settings.columns),
        handle: settings.handleSelector,
        placeholder: 'widget-placeholder',
        forcePlaceholderSize: true,
        revert: 300,
        delay: 100,
        opacity: 0.8,
        containment: 'document',
        start: function (e,ui) {
            $(ui.helper).addClass('dragging');
        },
        stop: function (e,ui) {
            $(ui.item).css({width:''}).removeClass('dragging');
            $(settings.columns).sortable('enable');
            /* Save prefs to cookie: */
            iNettuts.savePreferences();
        }
    });
},

savePreferences : function () {
    var iNettuts = this,
        $ = this.jQuery,
        settings = this.settings,
        cookieString = '';

    if(!settings.saveToCookie) {return;}

    /* Assemble the cookie string */
    $(settings.columns).each(function(i){
        cookieString += (i===0) ? '' : '|';
        $(settings.widgetSelector,this).each(function(i){
            cookieString += (i===0) ? '' : ';';
            /* ID of widget: */
            cookieString += $(this).attr('id') + ',';
            /* Color of widget (color classes) */
            cookieString += $(this).attr('class').match(/\bcolor-[\w]{1,}\b/) + ',';
            /* Title of widget (replaced used characters) */
            cookieString += $('h3:eq(0)',this).text().replace(/\|/g,'[-PIPE-]').replace(/,/g,'[-COMMA-]') + ',';
            /* Collapsed/not collapsed widget? : */
            cookieString += $(settings.contentSelector,this).css('display') === 'none' ? 'collapsed' : 'not-collapsed';
        });
    });
    $.cookie(settings.saveToCookie,cookieString,{
        expires: 10
        //path: '/'
    });
},

sortWidgets : function () {
    var iNettuts = this,
        $ = this.jQuery,
        settings = this.settings;

    /* Read cookie: */
    var cookie = $.cookie(settings.saveToCookie);
    if(!settings.saveToCookie||!cookie) {
        /* Get rid of loading gif and show columns: */
        //$('body').css({background:'#000'});
        $(settings.columns).css({visibility:'visible'});
        return;
    }

    /* For each column */
    $(settings.columns).each(function(i){

        var thisColumn = $(this),
            widgetData = cookie.split('|')[i].split(';');

        $(widgetData).each(function(){
            if(!this.length) {return;}
            var thisWidgetData = this.split(','),
                clonedWidget = $('#' + thisWidgetData[0]),
                colorStylePattern = /\bcolor-[\w]{1,}\b/,
                thisWidgetColorClass = $(clonedWidget).attr('class').match(colorStylePattern);

            /* Add/Replace new colour class: */
            if (thisWidgetColorClass) {
                $(clonedWidget).removeClass(thisWidgetColorClass[0]).addClass(thisWidgetData[1]);
            }

            /* Add/replace new title (Bring back reserved characters): */
            $(clonedWidget).find('h3:eq(0)').html(thisWidgetData[2].replace(/\[-PIPE-\]/g,'|').replace(/\[-COMMA-\]/g,','));

            /* Modify collapsed state if needed: */
            if(thisWidgetData[3]==='collapsed') {
                /* Set CSS styles so widget is in COLLAPSED state */
                $(clonedWidget).addClass('collapsed');
            }

            $('#' + thisWidgetData[0]).remove();
            $(thisColumn).append(clonedWidget);
        });
    });

    /* All done, remove loading gif and show columns: */
    //$('body').css({background:'#fff'});
    $(settings.columns).css({visibility:'visible'});
}

};

如果有人能给出提示找到问题的答案，那将是绝对好的。我的知识结束了

提前感谢您的时间。请问，

丹尼尔

Answer 1

自从你提出这个问题以来已经过了一段时间，但我发现自己面临着类似的问题。

首先，您应该关注以下帖子中的SLaks建议，或者只需使用Firebug逐步执行代码，以便更好地确定问题所在：uncaught exception: Syntax error after jQuery upgrade

我将与你确认它是一个导致问题的jQuery版本，因为我的问题在1.3.2中不存在，但在1.4.2中存在。它似乎与jquery选择器有关，因此找到问题的开始位置将使查找解决方案变得更容易。

基于jQueryUi的可排序的jQuery问题

1 个答案: