我正在尝试使用小部件工厂扩展JQuery.ui.draggable。直到初始化事件后再设置事件为止,一切似乎都工作正常,此时事件绑定似乎无法正常工作。在其他情况下,例如在init上设置事件也可以。
//
// extend jquery ui draggable
//
$.widget("ui.drag2", $.ui.draggable, {
options: {
shiftable: false,
shiftContainer: null,
shiftableSelKeys: {}
}
_initShiftable: function () {},
_shiftTarget: function () {}
});
//
// after the above is defined, i can call this below, and draggable works //(effectively inheriting from ui.draggable and containing all my new members
//
$('.myClass').drag2();
//
// I can also do this, and get a custom callback bound to drag (msg)
//
$('.myClass').drag2({
drag: function (ui, evt) {
console.log(' -- dragging -- ');
}
});
// But this Doesn't work ?
// I don't understand why binding the event after its been intialized doesn't // work
$('.myClass').on('drag', function (ui, evt) { console.log('-- dragging --'); }); // Doesn't work ?
答案 0 :(得分:0)
我需要为我的插件定义私有方法_setOption。这会将您传递的选项应用于您要从其继承的父窗口小部件。由于我依赖于其拖动的实现,因此我需要将该选项应用于父窗口小部件。
$.widget("ui.drag2", $.ui.draggable, {
options: {
shiftable: false,
shiftContainer: null,
shiftableSelKeys: {}
},
_setOption: function (key, value) {
// invoke setOption for draggable
this._super(key, value);
this._superApply(arguments);
}
});
// setting drag callback
$('.target').drag2('option', 'drag', function (){ console.log('hello world'); );