如果我有5個按鈕具有相同的CLASS，我可以使用JavaScript onclick獲取ID嗎？

Question

我有5個按鈕設置了相同的類「deletebutton」

但每個deleton按鈕中有着獨特用途（刪除不同的ID）

$(".deletebutton").click(function (e){ 
    document.getElementById("abc").href="delete.php?adID="; + ID of button clicked 
}); 

什麼，我需要做的是修改的另一個鏈接按鈕，基於點擊的按鈕的ID。

<a id="Delete" href="remove.php?adID=" >Confirm</a> 

我一直有這個問題，並認爲它是因爲我的「deletebutton」功能逃跑按鈕的CLASS只知道不是specifc按鈕的ID點擊類？想法？

Answer 1

您可以使用任何這些獲得ID this.id或e.target.id或$(this).attr("id")

$(".deletebutton").click(function (e){ 
    document.getElementById("abc").href="delete.php?"+ this.id; 
}); 

Answer 2

好訪問特定元素的ID，你將不得不使用$(this).attr('id')，但 的推薦方法或最佳練習這樣做是使用HTML 5數據屬性。您可以將它們存儲爲數據屬性，而不是使用ID。

<a class='action' data-mode="NEW" data-id='7' href="new.php?adID=" >New</a> 
<a class='action' data-mode="DELETE" data-id='7' href="remove.php?adID=" >Delete</a> 
<a class='action' data-mode="UPDATE" data-id='7' href="update.php?adID=" >Update</a> 

因此，您可以使用類或使用數據屬性本身訪問它們。

$('.action').on('click',function(e){ 
    var mode = $(this).data('mode'); 
    //This will output NEW/DELETE/UPDATE based on what you clicked 

    var id = $(this).data('id'); 
}); 

或

$('[data-mode]').on('click',function(e){ 
    var mode = $(this).data('mode'); 
    //This will output NEW/DELETE/UPDATE based on what you clicked 

    var id = $(this).data('id'); 
}); 

數據屬性提供瞭如此多的靈活性，存儲在DOM更多的信息，還提供了訪問它們更簡單的方法。

查看http://bit.ly/1nVOFgj以獲取有關如何使用數據屬性以及如何幫助您的更多信息。希望這可以幫助。