Question

我做了一些搜索，找不到这个问题的答案，加上一些搞乱的代码无济于事。我有一个标准的jQuery UI可拖动和可放置的设置，它的工作原理。

然而，当项目（在这种情况下为鞋子）被拖入可放置目标区域时，它们似乎被追加，因此旧项目保留在前面，新项目被添加到最后并被推出视图。

有没有办法让可排序的项目前置到我的目标droppable而不是附加？

编辑**

var proto = $.ui.droppable.prototype;

proto._create = function() {

    console.log('Calling the create method');

    var o = this.options, accept = o.accept;
    this.isover = 0; this.isout = 1;

    this.accept = $.isFunction(accept) ? accept : function(d) {
    return d.is(accept);
    };

    //Store the droppable's proportions
    this.proportions = { width: this.element[0].offsetWidth, height: this.element[0].offsetHeight };

    // Add the reference and positions to the manager
    $.ui.ddmanager.droppables[o.scope] = $.ui.ddmanager.droppables[o.scope] || [];
    $.ui.ddmanager.droppables[o.scope].unshift(this);

    (o.addClasses && this.element.addClass("ui-droppable"));
};

Answer 1

是的，虽然它很复杂。您需要扩展JQueryUI ui.droppable对象，修改_create函数。目前，它使用push将新项目添加到数组的末尾，如下所示：

$.ui.ddmanager.droppables[o.scope].push(this);

你想要使用unshift：

$.ui.ddmanager.droppables[o.scope].unshift(this);

JQuery droppable源码： https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.droppable.js

JavaScript unshift()文档：http://www.w3schools.com/jsref/jsref_unshift.asp

扩展JQueryUI小部件的教程：http://bililite.com/blog/extending-jquery-ui-widgets/

通过最后丢弃项目来排序jQuery可丢弃元素

1 个答案: