如何讓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做不同的事情？

回答

相關問題