如何在jquery中创建序列号

时间:2015-06-05 02:41:11

标签: jquery

我有一个代码: 当我点击"删除"时,它将删除1行表,现在我想要,当我删除任何行时,序列号将从1开始。例如:我有1到10,现在我删除1,数字2将改变1,数字3将改变2 ...数字10将改变9,如果我删除数字5,所以数字6将改变数字5,数字7将改变数字6 ....当我向表中添加1行时,序列号是表1的最后一个序列号。

<script type="text/javascript">
          var sott = 1;
          var result = $.parseJSON(data);
          //fill data to table

          var stringtogetTr= 'table#bangsp1 tr#tr_' + trGlobal;

          var tr = $(stringtogetTr);
          tr.find('td#stt').html(sott);
          tr.find('td#masp').html(result.masp);
          tr.find('td#donvitinh').html(result.donvitinh);
          tr.find('td#tensp').html(result.tensp);
          tr.find('td#dongia').html(result.dongia);
          tr.find('td#soluongtrongmoithung').html(result.soluongtrongmoithung);
          tr.show();
          tr.addClass('data');

          trGlobal += 1;

          //after fill data, create new tr, has id = tr_*
          createnewTr(trGlobal);

          caltotalvalue();
          } //end if(data)
          }); //end function(data)

          //calculate serial number
          var leng = $("table#bangsp1 tr.data").length;
          if(leng == 0){
             sott = 1;
           }else{ 
             sott += 1;
           }
           if(leng > 0){
             var leng1 = $("table#bangsp1 tr.data").length;
             sott = leng1 + 1;
           }
           });//end $("table#menusp a").click(function()


            }); //end chietkhau
          });//end $(document).ready(function() 



        </script>

现在我想删除表格中的任何产品时,序列号将从表格第一行的1开始。 请帮帮我。

1 个答案:

答案 0 :(得分:0)

所以我觉得我有点理解你的问题并迅速提出一个例子。这并没有使用您的原始代码,但希望它在概念上有所帮助。

&#13;
&#13;
$('button').on('click', function(){
  var row = $(this).closest('tr');
  var dynamicValue = $(row).find('.dynamic').text();
  dynamicValue = parseInt(dynamicValue);
  
  row.remove();
  $('.dynamic').each(function(idx, elem){
    $(elem).text(idx+1);
  }); 
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="dynamic">1</td>
    <td>Static One Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">2</td>
    <td>Static Two Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">3</td>
    <td>Static Three Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">4</td>
    <td>Static Four Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">5</td>
    <td>Static Five Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">6</td>
    <td>Static Six Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">7</td>
    <td>Static Seven Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">8</td>
    <td>Static Eight Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">9</td>
    <td>Static Nine Data</td>
    <td><button>Delete</button></td>
  </tr>
  <tr>
    <td class="dynamic">10</td>
    <td>Static Ten Data</td>
    <td><button>Delete</button></td>
  </tr>
</table>
&#13;
&#13;
&#13;