Jquery 如果它是第一次单击元素

Question

我需要我的脚本在第一次单击元素时执行某些操作，并在单击 2、3、4 等时继续执行不同的操作，

$('selector').click(function() {  
//I would realy like this variable to be updated  
var click = 0;  
    if (click === 0) {  
        do this  
        var click = 1;  
    } else {  
        do this  
    }
});//end click

我认为它应该依赖于变量，但我不知道如何更新从这里开始的变量任何帮助都会很棒。

Answer 1

看一下 jQuery 的 .data() 方法。考虑您的示例：

$('selector').click(function() {
    var $this = $(this),
        clickNum = $this.data('clickNum');

    if (!clickNum) clickNum = 1;

    alert(clickNum);

    $this.data('clickNum', ++clickNum);
});

请参阅此处的工作示例： http://jsfiddle.net/uaaft/

Answer 2

使用 data 来保存元素的状态。

在您的点击处理程序中，

使用

$(this).data('number_of_clicks')

检索值并

$(this).data('number_of_clicks',some_value)

来设置它。

注意：如果尚未设置，$(this).data('number_of_clicks') 将返回 false

编辑：固定链接

Answer 3

另一种选择可能是拥有两个函数，并使用 one 绑定一个函数$(document).ready() 中的函数（或绑定处理程序的任何位置），并在该函数中，使用 bind 或<代码>单击。

例如

function FirstTime(element) {
   // do stuff the first time round here
   $(element.target).click(AllOtherTimes);
}

function AllOtherTimes(element) {
   // do stuff all subsequent times here
}

$(function() {
    $('selector').one('click', FirstTime);
});

Answer 4

这在普通 Js 中非常简单。这是使用正确的、不同的点击处理程序

const onNextTimes = function(e) {
    // Do this after all but first click
};

node.addEventListener("click", function onFirstTime(e) {
    node.addEventListener("click", onNextTimes);
}, {once : true});

文档，CanIUse

Answer 5

如果您只需要固定行为的序列，您可以这样做：

$('selector').toggle(function(){...}, function(){...}, function(){...}, ...）；

切换方法中的事件处理程序将被有序调用。

Answer 6

$('#foo').one('click', function() {
alert('这只显示一次。');
});

这会将点击事件绑定到相应的 Html 元素一次，并在第一次事件渲染后自动取消绑定。

或者您也可以执行以下操作：

$("#foo").bind('click',function(){

// 某些活动

$("#foo").unbind("click");
// 将其绑定到其他一些事件处理程序。

});