javascript - INPUT 表单的少数字段不允许输入数据

Question

我有一个表单，表单上有一个按钮（+符号），它附加一行以插入值。在我的表单中，我可以在第一行的两个字段（stationerytype和stationeryqty）上输入值。但是，一旦我通过单击加号按钮添加新行，我就无法在第二行的字段中插入任​​何值，staionerytype而我能够在stationeryqty第二行的字段中插入值。

我的代码是：

<table   class="table table-bordered" id="tb" >
<tr class="tr-header">

<th class= "col-md-1" align="centre">Sl.No.</th>
<th class= "col-md-6" align="centre">STATIONARY TYPE</th>
<th class= "col-md-4" align="centre">STATIONARY QUANTITY</th>
<th class= "col-md-1"><a href="javascript:void(0);" style="font-size:18px;" id="addMore" title="Add More Stationery"><span class="glyphicon glyphicon-plus"></span></a></th>

</tr>
<tr>
<?php
for($i=1;$i<=1;$i++)
{   
?>

<td><input type="text" style="text-decoration: none" name="slno" value= "<?php echo $i; ?>"  ></td>
<td><input type="text" style="text-decoration: none" name="stationerytype"  ></td>
<td><input type="number" name="stationeryqtyrecd" id="stationeryqtyrecd" min="0"></td>

<td><a href='javascript:void(0);'  class='remove'><span class='glyphicon glyphicon-remove'></span></a></td>
</tr>
<?php  }?>
</table>

<button type="submit" name="add" class="btn btn-info"  align="middle" >ADD </button>   

<script>
var max = 4;
var count = 1;
$(function(){
    $('#addMore').on('click', function() {
            if(count <= max ){
              var data = $("#tb tr:eq(1)").clone(true).appendTo("#tb");
              data.find("input").val('');
              debugger;
              data.find("input")[0].value=++count;
            }else{
             alert("Sorry!! Can't add more than five samples at a time !!");
           }
              
     });
     $(document).on('click', '.remove', function() {
         var trIndex = $(this).closest("tr").index();
            if(trIndex>1) {
             $(this).closest("tr").remove();
           } else {
             alert("Sorry!! Can't remove first row!");

     var trIndex = $(this).closest("tr").index();
        if(trIndex>1) {
         $(this).closest("tr").remove();
         count--;
         
         // get all the rows in table except header.
         $('#tb tr:not(.tr-header)').each(function(){
         $(this).find('td:first-child input').val(this.rowIndex);
         })
           }
      });
}); 
 
</script>
                            </div>  

标签： javascripthtmlforms