如何知道元素是否已被点击jquery

时间:2011-07-27 09:30:58

标签: jquery events click

我有一个场景,我点击一个元素说#stationLink。当我再次点击它时,我想知道该元素是否已被点击。我试过了

var a=false;
$("#stationLink").click(function(){
   $(this).click(function(){
     a = true
   });
   console.log(a);
});

我得到false两次然后只有true ..我想我错过了一些东西。或者还有其他方法吗?

7 个答案:

答案 0 :(得分:9)

这应该做你想要的(包括按照我在某些评论中看到的那样保留一个计数器

$("#stationLink").click(function(e){
   var $this = $(this);
   var clickCounter = $this.data('clickCounter') || 0;
   // here you know how many clicks have happened before the current one

   clickCounter += 1;
   $this.data('clickCounter', clickCounter);
   // here you know how many clicks have happened including the current one

});

使用.data()方法将计数器与DOM元素一起存储,这样就可以将同一个处理程序应用于多个元素,因为每个元素都有自己的计数器。

演示http://jsfiddle.net/gaby/gfJj6/1/

答案 1 :(得分:4)

您可以添加一个可以检查的属性:

$("#stationLink").click(function(){
   $(this).attr("hasBeenClicked", "true");
});

我不喜欢使用全局变量来确定是否已点击此项目的原因很简单,如果您必须跟踪多个项目,那么它可能会有点混乱。我更喜欢ass类或属性,你可以在元素上看到它是否被点击

答案 2 :(得分:3)

此版本记录了点击次数:

$("#stationLink").click(function() {
    var clickCount = $(this).data('clickCount') || 0;

    if (clickCount > 0) {
        // clicked `clickCount` times
    }

    $(this).data('clickCount', clickCount + 1);
});

要重置点击次数,请使用

$("#stationLink").data('clickCount', 0);

答案 3 :(得分:3)

那是因为你第一次单击它时实际上是将另一个点击处理程序绑定到该元素。只需删除该处理程序。

var clicked = false;
$("#stationLink").click(function(){
    clicked = true
    //Code to toggle if required. 
});

答案 4 :(得分:2)

另一种选择是:

$('#stationLink').click(function(){
   $(this).data('clicked', true);
});

console.log($(this).data('clicked'));

我认为这是jquery ui最常用的方法。

答案 5 :(得分:1)

我通常会添加一个名为.chosen或.x_visited的类

$("#stationLink").click(function(){
$(this).addClass("x_visited")
}

然后您可以使用$("#stationLink").hasClass('x_visited');进行检查,例如

答案 6 :(得分:1)

var stationLink_clicked = false;

$("#stationLink").click(function(){
   console.log('Already clicked? ' + stationLink_clicked);
   /* do stuff */

   stationLink_clicked = true;
});