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使用元素保存您的状态。

在您的点击处理程序中

使用

$（本）。数据（ 'NUMBER_OF_CLICKS'）

检索值和

$（本）。数据（ 'NUMBER_OF_CLICKS'，SOME_VALUE）

设置它。

注意：$（this）.data（'number_of_clicks'）如果尚未设置则返回false

编辑：固定链接

Answer 3

另一种选择可能是拥有两个函数，并使用$(document).ready()中的one函数（或绑定处理程序的任何位置）绑定一个函数，并在该函数中，将第二个函数绑定为使用bind或click运行所有后续点击。

e.g。

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

Documentation，CanIUse

Answer 5

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

$（'selector'）。toggle（function（）{...}，function（）{...}，function（）{...}，...）;

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

Answer 6

$（'＃foo'）。one（'click'，function（）{ alert（'这将只显示一次。'）; }）;

这会将click事件绑定到Corresponding Html元素，并在第一次事件渲染后自动解除绑定。

或者你也可以：

$（ “＃foo” 的）。结合（ '点击'，函数（）{

//一些活动

$（ “＃foo” 的）解除绑定（ “点击”）。 //将它绑定到其他一些事件处理程序。

}）;

Jquery，如果它是第一次点击元素

6 个答案: