递增和递减1个值 - 按钮

我求和计算过程中的jQuery，看起来像这样：递增和递减1个值 - 按钮

<th>Name</th> 
<th>Vote</th> 
<th>Action</th> 

<tr> 
    <td>User A</td> 
    <td class="vote">5</td> 
    <td> 
    <a href="#" class="btn btn-lg btn-primary addVote">+</a> 
    <a href="#" class="btn btn-lg btn-primary subVote">-</a> 
    </td> 
</tr> 
<tr> 
    <td>User B</td> 
    <td class="vote">3</td> 
    <td> 
    <a href="#" class="btn btn-lg btn-primary addVote">+</a> 
    <a href="#" class="btn btn-lg btn-primary subVote">-</a> 
    </td> 
</tr>

这里是我的jQuery：

$(function() { 
    $(".addVote").each(function() { 
    var vote = $('td.vote').text(), 
     newVote = parseInt(suara) + parseInt(1); 

    $(this).on('click', function() { 
     $('td.vote').text(newVote); 
    }); 
    }); 
});

什么我想实现的是当我点击'+'按钮时，newVote值应该替换值值，并且每次点击'+'按钮时该过程都会继续。如果单击“ - ”按钮，应该会发生同样的过程。我只能做一次。下一个过程没有任何反应我怎样才能做到这一点？

来源

2016-07-29 MSI

我希望它会为你工作

$(document).ready(function(){ 
     $('table').on('click','.addVote, .subVote', function() { 
     var _vote= $(this).closest('tr').find('td.vote'); 
     var change = $(this).hasClass('addVote') ? 1 : -1; 
     _vote.text((parseInt(_vote.text())+change)); 
    }); 
    });

检查此琴链接https://jsfiddle.net/36udn5Lv/2/

来源

2016-07-29 06:10:25

检查这个.. https://jsfiddle.net/36udn5Lv/2/ –

这是工作太...三江源！ – MSI

我认为，这是一个优化的解决方案，以轻松的执行负载，然后罗马的答案。所以如果你喜欢这个答案，请检查它的权利。 –

请尝试下面的代码片段。

$(function() { 
 
    $(".addVote").click(function() { 
 
    $(this).parents('tr').find('td.vote').html(parseInt($(this).parents('tr').find('td.vote').html())+1); 
 
    }); 
 
    $(".subVote").click(function() { 
 
    $(this).parents('tr').find('td.vote').html(parseInt($(this).parents('tr').find('td.vote').html())-1); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    
 
<table> 
 
<th>Name</th> 
 
<th>Vote</th> 
 
<th>Action</th> 
 

 
<tr> 
 
    <td>User A</td> 
 
    <td class="vote">5</td> 
 
    <td> 
 
    <a href="#" class="btn btn-lg btn-primary addVote">+</a> 
 
    <a href="#" class="btn btn-lg btn-primary subVote">-</a> 
 
    </td> 
 
</tr> 
 
<tr> 
 
    <td>User B</td> 
 
    <td class="vote">3</td> 
 
    <td> 
 
    <a href="#" class="btn btn-lg btn-primary addVote">+</a> 
 
    <a href="#" class="btn btn-lg btn-primary subVote">-</a> 
 
    </td> 
 
</tr> 
 
</table>

来源

2016-07-29 06:27:33

它的工作正常。谢谢！ – MSI

@MSI，欢迎你 –

检查：

  <html> 
      <head> 
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 
      </head> 
      <body> 
       <table> 
        <th>Name</th> 
        <th>Vote</th> 
        <th>Action</th> 

        <tr> 
         <td>User A</td> 
         <td class="vote">5</td> 
         <td><a href="#" class="btn btn-lg btn-primary addVote">+</a> <a 
          href="#" class="btn btn-lg btn-primary subVote">-</a></td> 
        </tr> 
        <tr> 
         <td>User B</td> 
         <td class="vote">3</td> 
         <td><a href="#" class="btn btn-lg btn-primary addVote">+</a> <a 
          href="#" class="btn btn-lg btn-primary subVote">-</a></td> 
        </tr> 
       </table> 
       <script> 
           $(function() { 
            $(".addVote").click(function() { 
              var vote = $(this).closest('tr').find('td.vote').text(); 
             var newvote = parseInt(vote)+parseInt(1); 
             $(this).closest('tr').find('td.vote').text(newvote); 
            });  
            $(".subVote").click(function() { 
              var vote = $(this).closest('tr').find('td.vote').text(); 
             var newvote = parseInt(vote)-parseInt(1); 
             $(this).closest('tr').find('td.vote').text(newvote); 
            });  
           }); 
       </script> 
      </body> 
      </html>

来源

2016-07-29 06:41:03 Roma

它的工作。谢谢！所有答案都正常工作。 – MSI

递增和递减1个值 - 按钮

回答

相关问题