Question

基本上，如果这是我的代码：

jQuery.fn.createSelector = function(){
   return this.hide()
   .after('<div class="newElement"></div>');
   // bind'em !
   $(".newElement").click(function(){
      alert('test');
   });
};

该函数返回元素（将其插入HTML），但不绑定其上的click事件。我需要在我的函数插入的每个元素上绑定各种事件，但我不知道如何:(谷歌也没有真正帮助。

提前致谢！

Answer 1

您在执行绑定之前返回。只需重新排列就可以了：

var $newElement = $('<div class="newElement"></div>');
$newElement.click(yourFunc);
return this.hide().after($newElement);

您当前的代码还有另一个潜在的问题：它会将点击事件绑定到页面上的每个 .newElement，因此每次调用它时，所有先前创建的.newElement s将再次受到约束。这可能就是你想要做的，但这看起来很不寻常，所以我想我会提到它。

有一种更简单的方法可以做到这一点 - 也许。查看jQuery的live函数。可能不适用于所有情况，但它可以是一个很大的帮助。您不必每次创建.newElement时都必须绑定，而只需说“所有.newElements应该在您点击它们时执行此代码。”胜利的声明性事件绑定：

//Put this somewhere in your init function (or wherever)
$('.newElement').live('click', function()
{
    alert("Neat stuff");
});

然后你的createSelector身体就是：

return this.hide().after('<div class="newElement"></div>');

事件会自动被动地“约束”它。

Answer 2

您的函数正在添加新元素，然后立即返回，在调用.click()之前，所以处理程序永远不会被绑定。

在绑定到新元素后，在上返回您调用.createSelector()的元素：

jQuery.fn.createSelector = function() { this.hide().after('<div class="newElement"></div>'); $(".newElement").click(function() { alert('test'); }); return this; };

如何为我自己的函数迭代的每个元素绑定一个函数？

2 个答案: