javascript - .one() 没有调用其他相同的活动组件

Question

我有以下 jquery.one()代码：

$("<div class='one'>One</div>").appendTo("#mane");
$("<div class='one'>One</div>").appendTo("#mane");
$("<div class='one'>One</div>").appendTo("#mane");

$("#mane").one("click", ".one", function(event){
     alert(1);
});

为什么叫一次？而不是每个项目一次？在文档.one()中每个项目调用一次函数？

JSFiddle：http: //jsfiddle.net/74cv9/

谢谢。

Answer 1

我不认为这个功能是内置的，所以你必须自己做：

$("#mane").on("click", ".one", function(event){
    if ( !$(this).data('clicked') ) {

        // do your stuff here, this .one element hasn't been clicked before



        $(this).data('clicked', true);
    }
});

Answer 2

该事件绑定到单个元素#mane，因此只会对该元素发生一次，无论您将其委托给多少个元素。解决这个问题的一个简单方法是使用.on一个额外的选择器，无论它是类、属性等，事件发生后可以删除/更改的东西：

$("<div class='one clickable'>One</div>").appendTo("#mane");
$("<div class='one clickable'>One</div>").appendTo("#mane");
$("<div class='one clickable'>One</div>").appendTo("#mane");

$("#mane").on("click", ".one.clickable", function(event){
     alert(1);
     $(this).removeClass("clickable");
});

Answer 3

因为根据您的代码，您将一个事件绑定到“#mane”而不是“.one”。

应该是这样的

$(".one").one("click", function(event){
    alert(1);
});

Answer 4

这是更新的小提琴：http: //jsfiddle.net/74cv9/2/

和代码：

$("#mane").find('.one').one("click", function(event){
    alert(1);
});

jQuery 文档指出：

每个事件类型都会调用一次事件处理程序

每个选择器不是一次。在您的初始代码中只有一个事件，“点击”。

随意挑战我的答案:)

Answer 5

这个怎么样：

$("#mane").on("click", ".one", function(event){
  alert(1);
  $(this).off(event);
});