javascript - 如何计算点击次数并在循环javascript中更改其值？

Question

我有一个问题来计算我点击“添加更多”按钮并同时添加输入框的次数，这是我的 JavaScript:

var i = $('table tr').length;
var count = $('table tr').length;
var row = i;
var a = 0;


for (a = 0; a <= i; a++) {
  $(".addmore_" + a).on('click', function (a) {
    return function() {
          var s = 1;
      var data = "<td><input class='form-control sedang' type='text' id='packinglist_" + a + "' name='packinglist[]'/></td>";
      $("#keatas_" + a).append(data);
       $('#jumrow_'+a).val(s++);
    } ;
  } 
  (a));
};

这是我的 html :

     <div class='table-responsive'>
                        <table class='table table-bordered'>
                            <tr>
                                <th>No</th>
                                <th>Jenis Benang</th>
                                <th>Warna</th>
                                <th>Lot</th>
                                <th>Netto</th>
                                <th>Box</th>
                                <th>Cones</th>
                                <th>Keterangan</th>
                                <th></th>
                            </tr>";

$s=mysql_query("SELECT * FROM surat_jalan order by identitas_packing_surat DESC");
    $a=mysql_fetch_array($s);




            for($i=1;$i<=$_POST['jumlahdata'];$i++)
            {
                    $nomor = $a[19];
                    $iden = $nomor + $i;
                        echo"   <tr>
                                <td><span id='snum'>$i.</span></td>
                                <input class='form-control' type='hidden' id='hiddenlot_$i' name='hiddenlot[]' />
                                <input class='form-control' type='hidden' id='hiddencustomer_$i' name='hiddencustomer[]' />
                                <input class='form-control' type='hidden' id='hiddenprice_$i' name='hiddenprice[]' />
                                <td><input class='form-control' type='text' id='jenisbenang_$i' name='jenisbenang[]' readonly/></td>
                                <td><input class='form-control' type='text' id='warna_$i' name='warna[]' readonly/></td>                                
                                <td><input class='form-control' type='text' id='lot_$i' name='lot[]' required/></td>
                                <td><input class='form-control sedang' type='text' id='netto_$i' name='netto[]' required/> </td>
                                <td><input class='form-control pendek' type='text' id='box_$i' name='box[]'/> </td>
                                <td><input class='form-control pendek' type='text' id='cones_$i' name='cones[]'/> </td>
                                <td><input class='form-control' type='text' id='keterangan_$i' name='keterangan[]'/>
                                <input class='form-control' type='text' id='keterangan_$i' name='identitas[]' value='$iden'/>
                                <input class='form-control' type='text' id='jumrow_$i' name='jumpack' value=''/>    
                                 </td>

                                <td><a><span class='glyphicon glyphicon-plus addmore' id='$i'></span></a> </td>
                            </tr>
                            <tr>
                            <td colspan='10'>
                                <table id='keatas_$i' class='keatas'>
                                    <tr></tr>
                                </table>

                            </td>
                            </tr>";

            }   

                     echo"  

                     </table>

因此，每次我单击 addmore 时，值都会增加 1，但仅在同一行中。对于不同的行，值将再次从 1 开始。我将 html 和 php 混合在 1 个文件中，但这不是主要问题。任何建议将不胜感激，并感谢您花时间在我的帖子上我希望你明白我的意思，因为我的英语是最差的。哈哈

Answer 1

使用 html，例如从中删除 $i:

 for($i=1;$i<=5;$i++)
                {
    <input class='form-control' type='text' id='jumrow_$i' name='jumpack' value=''/>    
                             </td>

                            <td><a><span class='glyphicon glyphicon-plus addmore' id='$i'></span></a> </td>
                        </tr>

                        </tr>";
}

不要使用循环，而是使用单个事件，例如:

  $(".addmore").on('click', function (a) {
     var cell= $(this).parents('td')
     var currentValue = cell.find("[name=jumpack]").data('addmore');
     if(currentValue==null || currentValue == undefined)
     {
          currentValue =0;  
     }
      else
      {
         currentValue=parseInt(currentValue);
      }
     var data = "<td><input class='form-control sedang' type='text' id='packinglist_" + $(this).index() + "' name='packinglist[]'/></td>";
      cell.parents('tr').append(data);
     currentValue++;
     cell.find("[name=jumpack]").val(currentValue).data('addmore',currentValue)
});