removeAttr（'id'）清除#id，但点击仍然有效

Question

我有<div id="SocialInteract">

$('#SocialInteract').click(function() {

$('#SocialCount').load('sc.php');
$('#TeacherAttendance').removeAttr('id');
});

当我查看InspectElement时，#id被删除但仍然需要点击。我做错了什么？

Answer 1

您的点击事件仍然会触发，因为该事件已附加到TeacherAttendance元素。

如果您要分离点击事件，则应使用off()或unbind()：

$('#TeacherAttendance').off('click');
$('#TeacherAttendance').unbind('click');

Answer 2

删除id不会删除已附加的click事件。使用unbind()方法删除附加的事件。

$('#TeacherAttendance').unbind("click");

编辑：

您应该使用off()作为更新后的版本。 unbind()仍然存在后备兼容性

$('#TeacherAttendance').off('click');

相关问题：Best way to remove an event handler in jQuery?

Answer 3

您正在绑定事件的DOM元素，然后删除id但已经注册的事件。

使用off或unbind或将global var设置为turnoff / remove / doNothing。

Answer 4

.click()只是附加和忘记。它并不关心该元素是否发生任何事情。

所以你要手动取消绑定事件。

.unbind('click');

Answer 5

要使事件绑定动态化，请将其攻击document并等待它冒泡：

$(document).on('click', #SocialInteract', function() {

$('#SocialCount').load('sc.php');
$('#TeacherAttendance').removeAttr('id');
});

这种方式将事件注册到document节点：如果在具有该ID的元素上触发了click事件，则会触发该事件。如果没有，它就不会。