我有一张表格,其中包含一行最初的1行输入字段。用户可以单击“新建行”按钮以获取另一行,其中包含空输入字段。这留下了每行的“New Row”按钮的多个副本 - 我想删除除最近创建的“New Row”按钮之外的所有按钮(即输入字段的最后一行中的按钮)。
我在:
设置了一个示例JSFiddlehttp://jsfiddle.net/fmdataweb/vRe9v/2/
我可以添加到现有的js中,删除点击的按钮,同时将新创建的按钮留在新行中吗?这是Javascript:
var table = $( '#nextYear' )[0];
$( table ).delegate( '#button2', 'click', function () {
var thisRow = $( this ).closest( 'tr' )[0];
$( thisRow ).clone().insertAfter( thisRow ).find( 'input:text' ).val( '' );
});
答案 0 :(得分:1)
您可以使用jQuery remove()从DOM中删除匹配元素集。
在您处于按钮单击事件中的情况下,this
是引用DOM中按钮对象的内容。
将this
转换为jQuery对象并在其上调用remove(),如下所示:
$(this).remove();
完成新代码:
var table = $('#nextYear')[0];
$(table).delegate('#button2', 'click', function() {
var thisRow = $(this).closest('tr')[0];
$(thisRow).clone().insertAfter(thisRow).find('input:text').val('');
$(this).remove(); // remove button that was clicked
});
请参阅DEMO
答案 1 :(得分:1)
使用$(this).remove();
jQuery $(this)如果控制代表控件触发了哪个事件。您可以使用remove()
方法删除从dom
<强> Live Demo 强>
var table = $('#nextYear')[0];
$(table).delegate('#button2', 'click', function() {
var thisRow = $(this).closest('tr')[0];
$(thisRow).clone().insertAfter(thisRow).find('input:text').val('');
$(this).remove();
});
答案 2 :(得分:1)
试试这个:DEMO:http://jsfiddle.net/xRQs8/2/
可以使用单个按钮完成:+
<table id="dataTable" cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td>
<input type="Button" value="Add More" name="AddMore" class="AddOption" />
</td>
</tr>
</table>