Question

我在div里面有一些按钮：

<div id="buttons">
    <button id="addRed" class="addTriangle">Add red</button>
    <button id="addGreen" class="addTriangle">Add green</button>
    <button id="addBlue" class="addTriangle">Add blue</button>
    <button id="addPurple" class="addTriangle">Add purple</button>
</div><!--buttons-->

而不是为每个按钮编写处理程序，我想写一个基于其ID创建新元素的函数。

如果我使用它：

$("#buttons").click(function(){
     var id = $(this).attr('id');
     alert(id);
});

我获取了父级的ID，但是如何获取被点击的特定按钮的ID？

Answer 1

您可以将click事件处理程序附加到实际按钮，如：

$("#buttons > button").click(function(){
     alert(this.id);
});

或使用类名：

$(".addTriangle").click(function(){
     alert(this.id);
});

Answer 2

使用班级点击事件

$(".addTriangle").click(function(){
     var id = $(this).attr('id');
     alert(id);
});

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<div id="buttons">
    <button id="addRed" class="addTriangle">Add red</button>
    <button id="addGreen" class="addTriangle">Add green</button>
    <button id="addBlue" class="addTriangle">Add blue</button>
    <button id="addPurple" class="addTriangle">Add purple</button>
</div><!--buttons-->

Jquery获取包含Div的元素的ID

2 个答案: