单击后从showcomments中删除类(来自所有类似的类)？

Question

我有这个:

$( document ).on( "click", ".showcomments", function() {

alert("ok");

var element = $(this);
var id = element.attr("data-postid");

$(element).removeClass('showcomments'); //remove class after click to avoid double call to this function

});

和HTML:

<a href="javascript:;" class="showcomments" data-postid="'1'">1</a>
<a href="javascript:;" class="showcomments" data-postid="'2'">2</a>
<a href="javascript:;" class="showcomments" data-postid="'3'">3</a>
<a href="javascript:;" class="showcomments" data-postid="'1'">1</a>

当用户点击2时,例如,它将从该类中删除类showcomments,用户将无法再点击2.

问题是当用户点击1(第一个或第二个链接)时,我想从页面中的所有1个链接(data-postid)中删除showcomments类.我不希望用户能够再次点击任何1.有任何想法如何从页面中的任何1删除类？

https://jsfiddle.net/LnLkkvpk/

Answer 1

您可以使用showcomments类获取所有元素,然后对其data-postid属性使用属性过滤器:

$( document ).on( "click", ".showcomments", function() {
    var postid = $(this).attr("data-postid");
    $('.showcomments[data-postid="' + postid + '"]')
        .removeClass( "showcomments" );
});