我的 colorbox 弹出窗口中的事件触发有很多问题。当前,有一个主干 View 负责处理用户配置文件页面。有一个照片库,单击它会打开一个包含照片、评论、评论输入表单和点赞按钮的颜色框。
我放入 colorbox 的 html 是模板本身的隐藏 div。一切都显示得很好,但点击东西不会触发任何东西。我想我会尝试将事件处理程序附加到我传递给 colorbox 函数的 html,因为我猜弹出的 colorbox 不被认为在主干 View 的 dom 中。函数如下,Backbone View 触发 img 上的点击事件。 var photoBox 是我想要在颜色框中显示的 html。我试图将事件处理程序附加到 photoBox,但无济于事。
popColorbox: function(event) {
var photoID = $(event.currentTarget).parent().attr('data-id');
var photoBox = $("#inline_example" + photoID).parent().html();
$(photoBox).on('click', '.unlike', function(){
console.log("hello");
alert("hello");
});
$(photoBox).on('click', '.like', function(){
console.log("hello");
alert("hello");
});
$.colorbox({html: photoBox});
}
最佳答案
您关于未触发事件的原因的第一个假设是正确的。在 Backbone View 中的 events被委托(delegate)给它们的根 el
,因为 colorBox 的元素不是 View 的 el
的子元素,所以它的事件不会被触发。
当您尝试直接绑定(bind)到 photoBox 时,您的事件没有被触发的原因我认为是因为 colorBox插件需要一个 html 字符串,它用它来构建它的 html(而不是仅仅附加您传入的节点)。
为了触发您的事件,您需要将它们绑定(bind)到 DOM
上的某个现有的 higher 元素,在这种情况下,您可能需要转到文档.
$(document).on('click', '.unlike', function(){
console.log("hello");
alert("hello");
});
$(document).on('click', '.like', function(){
console.log("hello");
alert("hello");
});
关于javascript - 如何将事件附加到 backbone 中的 colorbox 弹出窗口?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19939532/