时间戳

首页 > 解决方案 > 如何使用一次单击 +1 值，第二次单击 -1 值等来制作类似按钮

jquery - 如何使用一次单击 +1 值，第二次单击 -1 值等来制作类似按钮

问题描述

我刚来这地方

我有这个代码

<div class="like-buttons">
    <div class="liked"></div><button class="dislike like"><span class="countl">12</span></button>
</div>

https://codepen.io/Void0000/pen/oNzGmGr

我需要（用jQuery）制作一些功能，当我点击我的按钮时，它会计数+1（例如：如果它是2它变成3），当我再次点击它时，它会计数-1（例如：如果它是 3 现在变成 2）等等。

标签： jquerybuttonincrementdecrement

解决方案

根据@Shivam 的回答，你可以这样改变；

$('.like').onclick(function(){
     let like = $(this).closest('.countd').html();
     if($(this).hasClass("clicked")){
         $(this).removeClass("clicked");
         like++;
     }
     else{
         $(this).addClass("clicked");
         like--;
     }
     $(this).closest('.countd').html(like)
});

你能检查这个链接。我做了一些改变。

$(document).ready(function() {
   $('.like').click(function() {
       let like = parseInt($('.countl').html());
       if ($(this).hasClass("clicked")) {
           $(this).removeClass("clicked");
           like++;
       } else {
           $(this).addClass("clicked");
           like--;
       }
       $('.countl').html(like)
   });
});

推荐阅读