js 点击叠加，全局变量问题

Question

问题描述：在输入框种输入“条码”后点击确定，若输入的条码和表格中的条码对应， 则对应tr中复核数量加一;为什么我写的count++在第一次是正确的，如果输入第二个“条码”点击确定，复核数量会继承上一个条码叠加？求老哥指教

var count = 0;
//enter
$('.confirm_review').click(function () {

$('tbody tr td:nth-child(3)').each(function(index,val){
  if($(this).html()==$('.nav-input').val()){
    console.log('---------------复核数--------------');
    count++;
    $(this).parent().children().eq(-2)[0].innerHTML= count;
  }
});

});

Answer 1

你定义的count是全局变量
初始化count=0
click之后count++变成了1
再次点击 count不是0 而是1
每次点击让count=当前复合数 再++ 再innerHTML就好了

Answer 2

//enter
$('.confirm_review').click(function () {
    var count = 0;
    $('tbody tr td:nth-child(3)').each(function(index,val){
          if($(this).html()==$('.nav-input').val()){
                console.log('---------------复核数--------------');
                count = 当前数据的复核数
                count++;
                $(this).parent().children().eq(-2)[0].innerHTML= count;
          }
    });
});

Answer 3

相当于你的每条记录都公用一个count了

$('tbody tr td:nth-child(3)').each(function(index,val){
  if($(this).html()==$('.nav-input').val()){
    console.log('---------------复核数--------------');
    // 可以在这里去取你这条记录的初始复核数量值，然后将自增之后的值赋值给下面的innerHTML
    // 例如
    var d = 初始复核数量值
    $(this).parent().children().eq(-2)[0].innerHTML= d++;
  }
});

还有，建议你的查询对应记录用数组去操作判断，然后根据index值来设置内容，这样会好点

Answer 4

$('.confirm_review').click(function() {
    var code = $('.nav-input').val();
    var td = $('tbody tr td:nth-child(3)').filter(function() {
        return $(this).html() === code;
    });
    var target = td.parent().children().eq(-2);
    var count = +target.html();
    target.html(++count);
});

Answer 5

个人观点：
这个解决问题的思路好奇怪，为什么不把数据和视图分开处理呢？视图中的数据是完全公开的，这个计算逻辑不够严谨和安全。

解决方案：

// 确保这里的数据顺序与表格视图中的一致，通常来说也是如此
var tabData = [{barCode:'', count:0},...];

// K - barCode
// V - tabRowData
var barCodeMapped = {};
for (var i in tabData) barCodeMapped[tabData[i].barCode] = tabData[i];

$('.confirm_review').click(function(){
    var 
        refer = $('.nav-input').val(),
        rowData = barCodeMapped[refer];
    
    // 累计复核数量
    if (rowData){
        // 确保rowData.count总能得到一个正确的数值
        rowData.count = (+rowData.count||0) + 1;
        var rowIndex = tabData.indexOf(rowData);
        $('tbody>tr:eq(' + rowIndex + ')>td:eq(-2)').html(rowData.count);
    }
});

rowData保存数据有很多好处：

• 要提取这组数据发往服务器
• 根据复核数量来排序
• 等等