[英]jQuery problems with parent().remove()
我试图用jQuery克隆和删除表,但没有成功。 这是我要操作的表的示例:
<table>
<tr>
<td colspan="6" class="linha_space"></td>
</tr>
<tr>
<td colspan="3">Dummy1</td>
<td colspan="3">Dummy2</td>
</tr>
<tr>
<td colspan="2"><input name="aperf_cursos[]" type="text" /></td>
<td colspan="2"><input name="aperf_entidades[]" type="text" /></td>
<td colspan="2"><a href="javascript:void(0);" class="adicionar" onclick="add(this);"><img src="./images/add.gif" /></a><a href="javascript:void(0);" class="remover" onclick="remove(this);" style="display: none;"><img src="./images/delete.gif" /></a></td>
</tr>
<tr>
<td colspan="6" class="linha_space"></td>
</tr>
</table>
现在,javascript函数add()和remove():
function add(o){
var o = $(o);
var tr = o.parent().parent().parent();
tr.after(tr.clone());
tr.find('.adicionar').remove();
tr.find('.remover').show();
tr.next().find('input, select').val('');
tr.next().find('.remover').hide();
}
function remove(o){
var o = $(o);
o.parent().parent().parent().remove();
}
add(this)可以正常工作,但是remove(this)不能正常工作,它只会删除我的“ delete.gif”图像。 请问我做错了什么?
而不是这个parent.parent.parent疯狂(这是疯狂的,是的)您为什么不使用
element.closest(“ tr”)
找到它所在的行?
这种方法将始终如一地工作。
看一下jsFiddle 。
我使用jQuery来满足您的需求。
<table>
<tr>
<td colspan="6" class="linha_space"></td>
</tr>
<tr>
<td colspan="3">Dummy1</td>
<td colspan="3">Dummy2</td>
</tr>
<tr>
<td colspan="2"><input name="aperf_cursos[]" type="text" /></td>
<td colspan="2"><input name="aperf_entidades[]" type="text" /></td>
<td colspan="2"><a href="#" class="adicionar">Add</a><a href="#" class="remover" style="display: none;">Delete</a></td>
</tr>
<tr>
<td colspan="6" class="linha_space"></td>
</tr>
</table>
$(function() {
$(document).on('click', '.adicionar', function(event){
var o = $(event.target);
var tr = o.closest('table');
tr.after(tr.clone());
tr.find('.adicionar').remove();
tr.find('.remover').show();
tr.next().find('input, select').val('');
tr.next().find('.remover').hide();
});
$(document).on('click', '.remover', function(event){
var o = $(event.target);
var table = $(o.closest('table'));
table.remove();
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.