如果我有5个具有相同CLASS的按钮，我可以使用javascript onclick来获取ID吗？

Question

我有5个按钮设置了相同的类“ deletebutton”

但每个按钮按钮都有其独特的用途（删除不同的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>

我一直对此有疑问，并认为这是因为我从按钮CLASS上运行的“ deletebutton”功能仅知道该类，而不是所单击的特定按钮的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>

因此，您可以使用类或使用data属性本身来访问它们。

$('.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 ，以获取有关如何使用数据属性及其帮助的更多信息。 希望这可以帮助。