使用jQuery克隆仅复制1个具有类名的行
||
我已经为此苦苦挣扎了两天！根据SO的建议，我将添加按钮放在表格页脚中。第一次单击时，它将添加一个新行，这正是我想要的。但是，第二次添加了两行。第三次，四个新行；第四次，新增加了八排！它变得越来越糟！
此代码用于将成员添加到数据库。第一行是会员自己的信息。其他行供用户将其他成员添加到他们的组中。因此，这是我要克隆的第二行或更高行。新行应添加到末尾。
要复制的tr具有.leaderrow类。我认为jQuery每次都复制该类的所有行，而不仅仅是复制一个。每次单击按钮时，如何才能只添加一行？
这是jQuery：
$(document).ready(function(){
$(\'#addRow\').live(\'click\', function() {
$(\'.leaderrow\').clone().appendTo(\'#entries\');
});
})
<table width=\"100%\" border=\"0\" class=\"unsorted_table\">
<thead>
<tr>
<th>Name*</th>
<th>Action</th>
</tr>
</thead>
<tbody id=\"entries\">
<tr>
<td>User\'s own name</td>
<td> </td>
</tr>
<tr class=\"leaderrow\">
<td><select name=\"leaderid[]\" >
<option value=\"3\">Sue</option>
<option value=\"4\">Jeannie</option>
<option value=\"5\">Kerry</option>
<option value=\"6\">Travis</option>
</select>
</td>
<td><a href=\"\" name=\"delete_row[]\" class=\"remove\">remove</a></td>
</tr>
</tbody>
<tfoot>
<tr>
<td><p><input type=\"button\" id=\"addRow\" value=\"Add Another\" /></p></td>
</tr>
</tfoot>
</table>
没有找到相关结果
已邀请:
1 个回复
抢垢洛韧
选择与该类匹配的所有元素。您可以使用，或选择特定的一个。 但是，我建议您添加一个克隆的HIDDEN（具有两个类），然后在附加之前添加。 另外，如果要处理多个表，则可能要用进行一些操作以限制要搜索的区域：var tmpl = $(this).closest(\'table\').find(\'.leaderrow.template\'); tmpl.clone().removeClass(\'template\').insertBefore(tmpl); // and use CSS: // .leaderrow.template { display: none; }