我目前正在开发一个级联树菜单.展开树项目时,它会在其下方创建新的< div>,也可以展开.我可以得到第一组< div>来绑定并因此扩展,但我似乎无法使用“this._on”方法自动绑定新创建的div.我正在寻找类似于live(),delegate()和on()的功能.
我已经在http://jsfiddle.net/vEAhq/的jsFiddle中发布了我的代码.
我在第60行的_setupEvents方法下设置了事件绑定.
回顾一下,在_create方法中调用的refresh方法中创建的元素绑定没问题.它是在_expand方法中创建的元素,不会像我期望的那样受到约束.
在此先感谢您的时间.
$.widget( "custom.categoryMenu",{
options: {
links: null
},_create: function() {
this.refresh();
this._on('.categoryNavigationExpandIcon',{
click: function(event) {
var $container = $(event.target).parent();
if( ($container).data('expanded') === false ) {
this._expand($container);
} else {
this._contract($container);
}
}
});
},refresh: function() {
var $elm = this.element;
var $newElem;
var $itemTree = this.options.links;
var $itemTreeRoot = sortObj( $itemTree['1'],'function',true );
this._setupEvents();
$.each( $itemTreeRoot,function( key,value ) {
var ID = $itemTreeRoot[key];
var label = key;
$newElem = $( '
最佳答案
当您必须附加一些新创建的内容时,最好绑定文档上的事件,给定选择器或自定义事件.
例如,如果您尝试绑定给定类’.your-class’的点击：
$('.your-class').on('click',function (e) {
// ...
})
您更愿意将其替换为：
$(document).on('click','.your-class',function (e) {
// ...
})
它与jQuery UI完全相同：
你只想更换：
// Here you just bind a click on the existing elements of your class
this._on('.categoryNavigationExpandIcon',{
click: function(event) {
var $container = $(event.target).parent();
if( ($container).data('expanded') === false ) {
this._expand($container);
} else {
this._contract($container);
}
}
});
通过：
// Bind a custom event on the document in order to delegate this event event to the new created classes
this._on(this.document,{
'click.categoryNavigationExpandIcon': function(event) {
var $container = $(event.target).parent();
if( ($container).data('expanded') === false ) {
this._expand($container);
} else {
this._contract($container);
}
}
});
你可以在这里找到更新的JSFiddle：
http://jsfiddle.net/vEAhq/7/
顺便说一下,在使用jQuery创建元素时,可以跳过结束标记！
$('
