Jquery属性选择器点击

我试图选择具有特定属性的div。我只想要div仅在attribute与true值具有特定attribute点击。问题是，如果我再次单击div警报仍然显示，而它具有attribute与false值。Jquery属性选择器点击

HTML

<a href="#" data-spinner="true">Click Here</a>

jQuery的

$("a[data-spinner='true']").click(function() { 
     $("a[data-spinner='true']").attr("data-spinner",false); 
    alert("clicked"); 
});

来源

2016-08-18 zaarr78

要么删除第一次点击后的事件处理程序，或使用事件委派。 – CBroe

与您现有的代码的问题是，你附加的事件时，该元素具有的属性。之后更改属性的事实不会删除该事件处理程序，因此始终会调用它。

有几种方法可以解决这个问题。

第一种方法是使用委派的事件处理程序，它会一直占当前属性值：

$(document).on('click', 'a[data-spinner="true"]', function() { 
    $(this).attr("data-spinner", false); 
    alert("clicked"); 
});

另一种方法是单击处理程序本身内部检查属性的状态：

$("a[data-spinner]").click(function() { 
    if ($(this).data('spinner')) { 
     $(this).data('spinner', false) 
     alert("clicked"); 
    }); 
});

请注意，此方法允许您使用data()方法，这被认为是更好的做法。

你也可以去除第一次点击使用off()事件处理程序，或者只是使用one()附加的事件 - 这取决于设置data属性值的页面的其他逻辑。

来源

2016-08-18 14:19:22

你只是打我:) – Satpal

狡猾的答案！ –

当您更改data-spnner的值时，jQuery不重新声明该事件。必须通过程序处理这个代替，就像这样：

$("a[data-spinner]").click(function() { 
    var $this = $(this); 

    if($this.data('spinner')){ 
     alert("clicked"); 
    } 

    $this.data('spinner',false);  
});

来源

2016-08-18 14:21:14

我想补充到罗里McCrossan的回答是，相应地this，你也应该使用removeAttr取消设置属性：

$("a[data-spinner='true']").removeAttr("data-spinner");

来源

2016-08-18 14:22:56 Simon

你是对的，我只是更新我的答案。 – Simon

Jquery属性选择器点击

回答

相关问题