Question

   <table id="tb1" border="0" align="left" cellpadding="2" cellspacing="2" class="formTable" width="100%">
   <tbody>
      <tr> 
         <th class="coltextleft" colspan=3> seats </th>
         <th>Total Seat Count :  <span id="seats">0</span></th>
         <th>SALC  <input name="txt1" type="text" id = "txt1"></th>
         <th>Column name </th>   <th> <input name="id_reset" type="button"  id="id_reset" value="RESET" ></th>              
      </tr>
      <tr>
         <td>&nbsp;</td>
         <td id="zxx"> Col1</td>
         <td> Col2</td>
         <td> Col3</td>
         <td> COL4</td>
         <td>COL5</td>
         <td>COL6</td>
      </tr>
      <tr id ="rnum_$i"><td>$i</td>
         <td><input type="text" id="id_seats$i" name="seats[]"/></td>
         <td>HTML ELEMENT OF TYPE SELECT </td>
         <td>HTML ELEMENT OF TYPE TEXT</td>
         <td>HTML ELEMENT OF TYPE TEXT</td>
         <td>HTML ELEMENT OF TYPE TEXT</td>
         <td>HTML ELEMENT OF TYPE TEXT</td>
      <tr>
   </tbody>
</table>

对于上面的html表，我有5行，我们有一个按钮“Addone row”，它会在表格中添加一个新行。

var num = $('#id_seats1').parent().parent().parent().children().last().children().html()*1;

如何为上面的html表计算上面的Jquery语句。这句话给出了行数在上面的html表中出现。能否请您逐步执行本声明

var num = $('#id_seats1').parent().parent().parent().children().last().children().html()*1;

请帮助

Answer 1

 $('#id_seats1')

这会选择<input id='id_seats1'>元素。

 .parent().parent().parent()

选择td，然后选择tr，然后选择tbody元素。

.children().last()

这将选择tbody元素的最后一个子元素，即tr

.children().html()

这将选择最后一行中所有td的html内容

*1

将最后一行的内容（包含该行中单元格的所有内容的字符串）转换为数字。

由于第一个单元格包含一个计数器$i变量，因此该值最终会分配给var num

Answer 2

jQuery语句不会返回表中的行数，而是返回最后一个元素的子html的等效数字的内容。

用于查找表中总行数的jQuery代码段应该是

var num = $('#id_seats1').parent().parent().parent().children().length - 2;

可以优化为，

var num = $('#id_seats1').closest('tbody').children().length - 2;

但理想的解决方案是，

var num = $('#tb1 > tbody > tr').length - 2;

计算这个非常长的Jquery语句

2 个答案: