我有这个HTML5代码(例如):
<form id="peopleFormView">
<input type="checkbox" name="name1" value="5" />
<input type="checkbox" name="name3" value="2" />
<input type="checkbox" name="name4" value="3" />
</form>
<table id="domain5">
<tbody></tbody>
</table>
此代码由JS处理:
$(function(){
registerPerformersClickHandler();
});
function registerPerformersClickHandler(){
$('#peopleFormView input').click(function(){
var IdPerson = $(this).val();
if ($('#performer'+IdPerson).length == 0){
performer.add(IdPerson);
}
else{
performer.del(IdPerson);
}
});
var performer = {
del: function(IdPerson){
$('#performer'+IdPerson).remove();
}
}
识别元素存在$('#performer'+ IdPerson)。length == 0正常工作,但添加元素时
<tr id="performer5">
<td>Surname name</td>
</tr>
然后我再次点击相同的输入,JS正确调用performer.del(),但没有任何反应,没有错误,没有反应。如果我这样叫两次删除:
var performer = {
add: function(IdPerson){
var requestData = {
className : 'Performer',
method : 'getPerformerRowView',
params : IdPerson
};
$.post(openAjaxLoader, requestData)
.success(function(data){
orchestraDomain.addPerformerToDomain(data.IdDomain, data.performer);
})
.error(function(data){
window.alert(data.error);
})
}
,
del: function(IdPerson){
alert( $('[id=performer'+IdPerson+']').length );
$('#performer'+IdPerson).remove();
$('#performer'+IdPerson).remove();
}
}
var orchestraDomain = {
addPerformerToDomain: function(IdDomain, performer){
$('#domain'+IdDomain+' tbody').append(performer);
}
}
..它有效。如果呼叫是这样的话
var performer = {
del: function(IdPerson){
$('#performer'+IdPerson).remove().remove();
}
}
..它不起作用。看到有人,我没有看到问题?
::有什么样的魔法,你不觉得吗?
答案 0 :(得分:2)
您有重复的ID,这就是为什么我认为以及如何确认:
按ID删除元素只需要执行一次。如果你必须做两次,那么你有两个带有该id的元素。
.remove().remove()
无法正常工作,因为第一个.remove将删除所有选定的元素。它只删除选定的元素,这些元素应该只是一个元素。
选择元素两次并将其删除两次获得所需结果的事实也确认您有两个具有该ID的元素。以下是您可以运行的另一项测试:
var performer = {
del: function(IdPerson){
alert( $('[id=performer'+IdPerson+']').length ); // if > 1, your html is invalid and you have duplicate id's.
$('#performer'+IdPerson).remove();
}
}