Javascript 新创建的元素不是主干中的委托侦听器
通过Ajax创建新用户时,手动创建的新用户元素不是委派事件 如果我尝试将我的元素从一个列表移动到另一个列表,则调用this.delegateEvents,并应用单击侦听器。但是,无论我尝试什么,我都无法将单击侦听器应用于这个新创建的元素 事件甚至不需要附加到模型,我只需要一个简单的显示/隐藏事件即可Javascript 新创建的元素不是主干中的委托侦听器,javascript,jquery,backbone.js,Javascript,Jquery,Backbone.js,通过Ajax创建新用户时,手动创建的新用户元素不是委派事件 如果我尝试将我的元素从一个列表移动到另一个列表,则调用this.delegateEvents,并应用单击侦听器。但是,无论我尝试什么,我都无法将单击侦听器应用于这个新创建的元素 事件甚至不需要附加到模型,我只需要一个简单的显示/隐藏事件即可 events: { 'click a.toggle': 'toggleContent', }, addNewUserElement: function (userId) {
events: {
'click a.toggle': 'toggleContent',
},
addNewUserElement: function (userId) {
var $formName = this.$('form').attr('name');
var $listElement = this.createNewListElement(userId, $formName);
this.trigger('user-created-event', $listElement); // this.onUserCreate
},
createNewListElement: function (userId, $formName){
var html = this.$('form input#' + $formName + '_lastName').val().toUpperCase()
// more html creation
return html;
}
onUserCreate: function ($el) {
var targetList = '#active-users'
alert("User created");
this.insertIntoList(targetList, $el);
},
insertIntoList: function(targetList, $elementToMove){
this.undelegateEvents();
var added = false;
var $targetList = // grab a set of <li>'s
$targetList.append($elementToMove);
this.delegateEvents();
return false;
},
我在这里遇到的问题是,我创建了一个原始的HTML片段,而没有将其附加到主干模型。它需要附加到JS模型,并手动分配所有相关的侦听器。这也是为什么将元素从一个列表移动到另一个列表不会产生相同的问题,因为它们已经附加到另一个JS类 在代码的另一部分中,有一个createChildViews方法,因此我将其分离出来,并通过此方法传递新的HTML片段:
createChildViews: function () {
var $els = this.$('#active-users li, #deactivated-users li');
_.each($els, function (element) {
this.createChildView(element);
}, this);
},
createChildView: function(element){
var user = new User({ // the other JS class
el: element
});
this.listenTo(user, 'user-created-event', function (view) {
this.onUserCreate(view);
}, this);
},
onUserCreate: function ($el) {
var targetList = '#active-users';
window.alert("User created");
this.createChildView($el);
this.insertIntoList(targetList, $el);
},
这意味着所有相关的侦听器都被附加到HTML。您能提供一个简单且最好是自包含的示例来说明您正在做什么吗?这里有很多噪音需要消除,你不能指望人们费力地完成这些,也许JSFIDLE.net上的功能演示会有所帮助。createTargetListHandle做什么?@UziKilon哦,对不起,我正在清理代码,它只是返回了一些HTML它不太相关我在你粘贴的代码中看不到,实际向DOM添加新元素的位置