Javascript JQuery值'；i'；表中的每个按钮都从0开始，但我需要行按钮onclick从特定索引开始

当单击表中的每个按钮时，alert（）中的值“i”从0开始，但单击时我需要行按钮从特定索引开始

基本上，我认为for循环是从一开始就为每个单击的按钮循环。 解决办法是什么？Plz建议

   function sendGetData () {    
   $.ajax({
     type: 'GET',
     url: 'Refresh',
     success: function (data) {

         var trHTML = '';


         $.each(data, function (i, item) {

             if(data[i].test_progress=="Complete")
             {  

             var buttonVar = ('<button id="btn11">'+"Clicking"+'</button>');
             }
             else
                 {
             var buttonVar = ('<button id="btn12">'+"Stoping"+'</button>');
                 }


             trHTML += '<tr><td>' + data[i].test_type + 
             '</td><td>' + data[i].device_id + 
             '</td><td>' + data[i].make + '&nbsp'+data[i].model+
             '</td><td>' + data[i].stack_name +
             '</td><td>' + data[i].suite_name + 
             '</td><td>' + data[i].test_progress + '<br>&nbsp&nbsp&nbsp&nbsp'+data[i].tests_run+'/'+data[i].total_tests+
             '</td><td>' + data[i].start_time + 
             '</td><td>' + data[i].end_time +
             '</td><td>' + buttonVar +
             '</td></tr>';

              $(document).on('click', '#btn11', function(event) {
                 alert("The paragraph was clicked."+ i);
                });

              $(document).on('click', '#btn12', function(event) {
                 alert("The paragraph was not clicked."+i);
                });


            });
         $('#test1').append(trHTML);
         $('#test').hide();
         $('#show').show();


     }
 });
}

函数sendGetData（）{code> $.ajax({ 键入：“GET”， url:“刷新”， 成功：功能（数据）{ var trHTML=''； $。每个（数据、功能（i、项）{ 如果（数据[i]。测试进度=“完成”） { var buttonVar=（“”+”单击“+”）； } 其他的 { var buttonVar=（“”+“停止”+“”）； } trHTML+=''+数据[i]。测试类型+ ''+数据[i].设备id+ ''+数据[i]。生成+' '+数据[i]。模型+ ''+数据[i].堆栈名称+ ''+数据[i].套件名称+ ''+数据[i].测试进度+'
测试运行+'/'+数据[i].测试总数+ ''+数据[i].开始时间+ ''+数据[i].结束时间+ ''+按钮+ ''; $（文档）.on（'click'，'btn11'，函数（事件）{ 警报（“该段被点击。”+i）； }); $（文档）。在（'单击'，'btn12'，函数（事件）{ 警告（“未点击段落。”+i）； }); }); $（'#test1'）.append（trHTML）； $（'#test'）.hide（）； $（'#show'）.show（）； } }); }

---

您的脚本正在为循环中的按钮（无效html）生成重复的

id

属性，并且您也在复制

$（文档）。在（'click'）上，每次迭代中，…

脚本。由于无效的html，您的脚本将只在第一个按钮上使用

id=“btn11”执行操作

。使用类名和相对选择器获取行号

动态添加行的步骤

$.ajax({
  ....
  success: function (data) {
    $.each(data, function(index, item) {
      // initialize a row
      var row = $('<tr></tr>');
      // add table cells
      row.append($('<td></td>').text(item.test_type));
      row.append($('<td></td>').text(item.device_id));
      ....
      if (item.test_progress === 'Complete') {
        row.append($('<button></button>').text('Clicking').addClass('complete')); // add class name
      } else {
        row.append($('<button></button>').text('Stoping').addClass('notcomplete'));
      }
      // append the row
      $('#test1').append(row);
    });
  }
});

---

检查是否

i==您想要的索引

，然后做些什么…您使用重复的

id

属性创建了无效的html。请改用类名。是否要在单击按钮时获取该按钮所在行的索引（行号）？是，我想要索引（行号）当按钮被点击时，这是decHard提到的结束，以确定您试图用这段代码做什么，但看看好的，非常感谢这是我想要的…非常感谢

$('#test1').on('click', '.complete', function() {
  // Get the row number using the .index() function
  var rownum = $(this).closest('tr').index() + 1;
  alert("The paragraph was clicked. The row number is "+ rownum);
});