1

我有一个 jquery 脚本，它返回表中的行数，然后在<td>标签内设置该数字。

<tr>
 <td id = "jquery">

 </td>
 <td>
  <%= f.text_field :data1 %>
 </td>
 <td>
  <%= f.text_field :data2 %>
 </td>
  <td>
  <%= f.text_field :data3 %>
 </td>
</tr>
<script>
    var rowCount = $('#myTable tr').length
    $("#jquery").html(rowCount);    
</script>

此脚本有效，但是当我再次呈现此视图以向 myTable 添加另一行时，它仅更新第一行而不是下一行rowCount。任何想法如何解决这一问题？

4

2 回答 2

2

您再次添加同一行，因此将有 2 个 tr 具有与 jquery 相同的 id，在这种情况下，它仅选择具有给定 ID 的第一个元素。

所以代替 id 提供 class="jquery" 然后运行脚本：

 <td class= "jquery">

和

<script>
   $('tr').each(function(){
     var index= $('table').children('tr').index($(this))
     var position= index+1;
     $(this).children('td').first().html(position);
  })
</script>
于 2013-08-28T18:19:27.787 回答
1

使用它而不是您拥有的仅设置 id 的第一个元素的当前代码jquery。

如果您希望每个第一个 td 有总计数：

var count = $("#mytable tr").length;
$("#mytable tr > td:first-child").html( count );

每个第一个 td 都有行索引号

$("#mytable tr").each(function(){
   $(this).children("td").first().html( $(this).index() );
});

以上可能有一个较短的链条，但我现在想不出一个。如果您想要一个非零起始索引，只需使用.index()+1.

JSFiddle 演示

于 2013-08-28T18:27:06.957 回答