Question

我最近遇到了一个问题，花了我几分钟的时间来修复，让我对sortable中jQuery UI项目选项使用的默认选择器感到困惑。考虑一个portlet示例。我试图从sortable中排除一个项目，而不是调用：

$( ".column" ).sortable({
    connectWith: ".column"
});

我用过：

$( ".column" ).sortable({
     connectWith: ".column",
     items: ':not(.fixed)'
});

将默认行为视为将列中的每个portlet添加到可排序列表中，我认为我只能从中排除一个类。然而我看到了奇怪的行为。上面的代码使portlet的每个子元素都可以排序，如下所示：fiddle。显然这可以通过以下方式解决：

 $( ".column" ).sortable({
     connectWith: ".column",
     items: '.portlet:not(.fixed)'
});

我意识到：不是它自己应该选择所有不符合选择器条件的元素所以我的问题是为什么默认行为只选择父元素，为什么呢：不覆盖这种行为并选择孩子。

如果这是一个简单的问题，请道歉。

Answer 1

我认为正确的选择器必须是：

 $(".column").sortable({
     connectWith: ".column",
     items: '>:not(.fixed)'
 });

该选项的默认值为items: '> *',（可排序元素的每个直接后代http://api.jquery.com/child-selector/）。

参考：http://api.jqueryui.com/sortable/#option-items

演示：http://jsfiddle.net/7q9jq/1/

我正在检查代码，以了解为什么它可以对items选项匹配的项目进行排序。

更新

我认为问题的发生是因为这个jQuery UI功能：

   _create: function() {

        var o = this.options;
        this.containerCache = {};
        this.element.addClass("ui-sortable");

        //Get the items
        this.refresh();

        //Let's determine if the items are floating
        this.floating = this.items.length ? (/left|right/).test(this.items[0].item.css('float')) : false;

        //Let's determine the parent's offset
        this.offset = this.element.offset();

        //Initialize mouse events for interaction
        this._mouseInit();

},

通过调用this.refresh();它正在调用this._refreshItems(event);为起始选择器的所有匹配元素和附加items选项添加特定的可排序，因此它是所有元素的可排序行为。

jQuery UI可排序的默认选择器？

1 个答案:

更新