我对从 Nestable js 绑定的事件有疑问。我正在显示一个带有使用 Nestable 的列表的模式,问题是当我关闭模式并再次显示它时,我会重新绑定事件。然后,当我尝试将元素从一个列表移动到下一个列表时,我得到多个“dd-empty”。这是我的代码:
$(function () {
$('.dd').nestable({ maxDepth: 1 });
});
这导致 Nestable 上的所有事件都被绑定。然后我关闭模态并再次触发它。我正在考虑将代码附加到模态再次打开或关闭时被破坏的对象。问题是事件绑定在 Nestable 内部,我无法手动解除绑定。我知道一些库,如可拖动的 jquery UI,有一个销毁方法来处理这种情况,但 Nestable 没有。
编辑
没关系,我刚刚找到了避免这种情况的方法,只需向库中添加一个 unbind 方法,并且每次调用 Init() 方法(实际上只是一次),它都会调用 unbind 方法并解决我的问题。代码如下: 在 jquery.nestable.js 中,找到方法 Plugin,并将调用添加到方法 unbind_events();
function Plugin(element, options)
{
this.w = $(document);
this.el = $(element);
this.options = $.extend({}, defaults, options);
this.unbind_events();
this.init();
}
然后,在原型中的属性 init 之后添加 unbind 方法的代码。
unbind_events: function () {
console.log("Unbind events");
var list = this;
list.el.data('nestable-group', this.options.group);
list.placeEl = $('<div class="' + list.options.placeClass + '"/>');
list.el.unbind("click");
list.el.unbind("mousedown");
list.el.unbind("mousemove");
list.el.unbind("mouseup");
if (hasTouch) {
list.el[0].unbind('touchstart');
window.unbind('touchmove');
window.unbind('touchend');
window.unbind('touchcancel');
}
},
这解决了我的问题。问候。