具有相同类的多个元素使jquery点击事件触发多次

我显示用户评论。每条评论是一个div，每个div都有<a>标记，其类别为'commentLikeLink'。我将jquery点击事件绑定到'commentLikeLink'类，但是如果我有10条评论并且点击了一个按钮，我会将事件激发10次。
我知道发生这种情况是因为我有多次同班同学。但如何阻止此？
下面的代码：具有相同类的多个元素使jquery点击事件触发多次

... 
<div class="commentBox""> 
... 
@Html.ActionLink(likeText, "LikeComment", "Comment", null, new { id = Model.CommentId, @class = "commentLikeLink" })  
...

事件代码：

$(function() { 
      $('.commentLikeLink').click(function (event) { 
       var commentId = event.target.id; 

       $.ajax({ 
        url: this.href, 
        type: 'POST',      
        data: { commentId: commentId }, 
        context: this, 
        success: function (result) { 
         if (result.msg == '1') { 
          $(this).text('Dislike'); 
         } 
         else if(result.msg == '2') { 
          $(this).text('Like'); 
         } 

        } 
       }); 
       return false; 
      }); 
     });

来源

2012-09-05 1110

你能告诉你的最后源输出？ –

你怎么知道它发生了10次？ – Shyju

仅仅因为在页面上有十个元素具有相同的类，并且对该类的元素绑定了单击事件并不意味着当其中一个元素被实际单击时，所有十个元素都会获得单击事件。 –

我时，我无意中包含在页面相同。点击脚本函数多次在此之前发生的。确保你的JavaScript只包含一次

来源

2012-09-05 17:28:42

你不应该得到10点击。您可以绑定click事件的类，但其中引发该事件的背景是单独的元素，所以如果你有一些标记，看起来像这样：

<p> 
    <a href="#" class="clickItem">Liked?</a> 
    <br /> 
    <a href="#" class="clickItem">Liked?</a> 
    <br /> 
    <a href="#" class="clickItem">Liked?</a> 
    <br /> 
    <a href="#" class="clickItem">Liked?</a> 
</p>

那么这会工作，设置链接文字“喜欢！”因为每一个被点击：

$(document).on("click", ".clickItem", function (ev) { 
    $(this).text("Liked!"); 
});

你调试的代码？你确定一次点击10次吗？

来源

2012-09-05 17:30:14 kprobst

是将点击事件绑定到类是一个更好的解决方案，但它可以实际上被多次触发，如果你使用它自己的项目或它自己的类！

因此而不是如此：$('.commentLikeLink').click(function (event) { //在这里做的事情}

，你应该这样做，只会触发一次：

$(document).on("click", ".commentLikeLink", function (ev) { 
    //do things here 
});

来源

2013-12-04 15:24:00

具有相同类的多个元素使jquery点击事件触发多次

回答

相关问题