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);
});

.one（）不会调用其他相同的实时组件

5 个答案: