javascript - JQuery：在范围内获取对象

Question

我对 jQuery 很陌生。以下是我的代码的一部分

<div class = 'buttons'>
    <span>
    <input type='button' value='BUTTON1' id='button1'>
    </span>
    <span>
    <input type='button' value='BUTTON2' id='button2'>
    </span>
</div>

使用 jquery，我想打印单击按钮的 id。我尝试了以下方法：

$(".buttons > span").click(function () {
    alert("YOU CLICKED" + this.id);
});

但我认为这是指跨度对象。这很奇怪，因为 span 对象怎么会有点击事件？还是所有 jquery 对象都有“点击”？如何获取跨度中按钮的 ID？

谢谢你。

Answer 1

那这个呢？

$(".buttons > span > input").click(function () {
    alert("YOU CLICKED" + this.id);
});

Answer 2

这是通过捕获事件的目标元素来做到这一点的另一种方法：

$(".buttons > span").click(function (e) { 
    alert("YOU CLICKED" + e.target.id); 
}); 

Answer 3

$(".buttons > span").click(function () {
    alert("YOU CLICKED" + $('input[type=button]',this).prop('id'));
 });

或者您可以将事件绑定到按钮本身

$(".buttons > span > input[type=button]").click(function () {
    alert("YOU CLICKED" + this.id);
 });