如何让1个按钮改变ID做不同的事情？

我有一个按钮，当按下除了做某件事情，它改变了自己的ID，所以当再次按下时，它会做一些不同的事情，就好像它是一个不同的按钮。问题是，第一次更改id之后，prev按钮单击函数会抛出一个错误，因为该id不再存在。如何让1个按钮改变ID做不同的事情？

$("#button1").click(function() { 
    //do something 
    document.getElementById("#button1").id = "button2"; 
}); 

$("#button2").click(function() { 
    //do something different 
    document.getElementById("#button2").id = "button1"; 
});

来源

2014-10-27 MauriF

你应该改变一些与ID不同的东西......比如数据属性或者类。然后，您可以将您的行为建立在数据属性或是否存在类上。 – smerny 2014-10-27 18:04:08

我真的建议你只显示和隐藏单独的按钮，这样你就不必使用jquery函数绑定管理使你的生活复杂化 – Kristian 2014-10-27 18:04:12

我会改变方法。就像上面评论中提到的那样，或者删除第一个事件监听器（在第一个事件处理器中），并添加一个新的监听器。 – Teemu 2014-10-27 18:05:05

您可以通过使用jQuery做到这一点，但在评论中提到一样，这可能是你需要改变你的做法的迹象。但是，如果你必须这样做，这里有一个使用jQuery'on'的解决方案。

http://jsfiddle.net/WetNoodles/ab5yn7eL/

$('#outerContainer').on('click', '#button1', function() { 
    alert('button 1 clicked!'); 
    $(this).attr('id', 'button2'); 
}); 

$('#outerContainer').on('click', '#button2', function() { 
    alert('button 2 clicked!'); 
    $(this).attr('id', 'button1'); 
});

一些额外的注意事项 - 如果你把smerny的方法，你仍然需要使用“开”功能，以便将事件绑定到改变的属性，除非你onclick属性设置直接在html标签上。 克里斯蒂安的方法可以让你使用像你目前使用的点击功能。

来源

2014-10-27 18:14:20

优秀的，谢谢你的回答和jsfiddle的完整示例。 – MauriF 2014-10-27 18:43:11

面条，代表团不需要我提到的方法。 http://jsfiddle.net/ab5yn7eL/1/ – smerny 2014-10-27 18:48:11

@smerny啊，很好的电话。是的，我还在想2个独立的事件处理程序。 – 2014-10-27 18:50:07

如何让1个按钮改变ID做不同的事情？

回答

相关问题