我正在尝试更改已提交的 HTML 表单提交按钮的功能(通过更改表单的 ID)以用作切换按钮。但是，当表单的 id 更改时，on('submit',function) 不会更新并且仍然被调用，尽管 id 不再绑定(bind)到表单。 update_favourite(...) 在 AJAX 函数中被调用，但为了简单起见，我已从此代码段中删除了 AJAX
$('#add_favourite').on('submit', function(event){
event.preventDefault();
console.log('add');
update_favourite('add');
});
$('#remove_favourite').on('submit', function(event){
event.preventDefault();
console.log('remove');
update_favourite('remove');
});
function update_favourite(addOrRemove) {
if($('#add_favourite').length){
$('#remove_favourite').attr("onclick","");
$('#submitbutton').val('Remove from Favourites');
$('#add_favourite').attr("id","remove_favourite");
/*This doesn't make a difference
$('#remove_favourite').on('submit', function(event){
event.preventDefault();
console.log('remove');
update_favourite('remove');
});
*/
}
else if($('#remove_favourite').length){
$('#remove_favourite').attr("onclick","");
$('#submitbutton').val('Add to Favourites');
$('#remove_favourite').attr("id","add_favourite");
/*This doesn't make a difference
$('#add_favourite').on('submit', function(event){
event.preventDefault();
console.log('add');
update_favourite('add');
});
*/
}
};
我的实现正确地更改了提交按钮和表单 ID，但是 onclick 监听器不会随着 ID 的更改而更改。任何建议/更正将不胜感激!
最佳答案
有人发布了正确的答案，但在我尝试之前将其删除，经过一番尝试后，我能够实现我认为已删除的答案告诉我的内容。
他们的答案是将 $('#add_favourite').on('submit', function(event){ 更改为 $(document.body).on('submit', '#add_favourite', function(event){ 并添加 $(document.body).off('submit', 'remove_favourite'); 以移除监听器。
无论原评论者发生了什么，谢谢!
关于javascript - Jquery:删除 $ ('#id' ).on(...) 元素的 id 更改时的监听器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50610015/