Javascript 获取使用该函数的按钮的ID

我试图从使用点击功能的按钮中获取id，而不必将对象传递给该功能。我一直在用未定义的id代替id，我不知道为什么，我读到的所有东西都说这应该行得通

<input type="button" value="1" id="one" onclick="return A();"/>
<input type="button" value="2" id="two" onclick="return A();"/>
<input type="button" value="3" id="three" onclick="return A();"/>

<script type='text/javascript'>

function A(){
    var but = $(this).attr("id"); 
    alert(but); 
}    
</script>

函数A（）{
var but=$（this.attr（“id”）；
警惕（但是）；
}    

---

你需要像这样通过obj考试

<input type="button" value="3" id="three" onclick="return A(this);"/>

function A(obj){
    var but = obj.id; 
    alert(but); 
}

<input type="text" onclick="A(this)" />

功能A（obj）{
var但=对象id；
警惕（但是）；
}

---

你需要像这样通过obj考试

<input type="button" value="3" id="three" onclick="return A(this);"/>

function A(obj){
    var but = obj.id; 
    alert(but); 
}

<input type="text" onclick="A(this)" />

功能A（obj）{
var但=对象id；
警惕（但是）；
}

功能A（ele）{
var but=$（ele.attr（“id”）；
警惕（但是）；
}

但是，由于您已经在使用jQuery。。。你不妨这样做：

<input type="button" value="3" id="three" class="buttonClick"/>

$('.buttonClick').on("click", function() {
     var but = $(this).attr("id"); 
     alert(but); 
});

$（'.buttonClick'）。打开（“单击”，函数（）{
var but=$（this.attr（“id”）；
警惕（但是）；
});

功能A（ele）{
var but=$（ele.attr（“id”）；
警惕（但是）；
}

但是，由于您已经在使用jQuery。。。你不妨这样做：

<input type="button" value="3" id="three" class="buttonClick"/>

$('.buttonClick').on("click", function() {
     var but = $(this).attr("id"); 
     alert(but); 
});

$（'.buttonClick'）。打开（“单击”，函数（）{
var but=$（this.attr（“id”）；
警惕（但是）；
});

执行此操作的方法（由于您使用的是jQuery，因此我不建议这样做）是将元素传递给函数，如：

<input type="button" value="1" id="one" onclick="return A(this);"/>
function A(that){
    var but = that.id; 
    alert(but); 
}

执行此操作的方法（我不建议这样做，因为您使用的是jQuery）是将元素传递给函数，如下所示：

<input type="button" value="1" id="one" onclick="return A(this);"/>
function A(that){
    var but = that.id; 
    alert(but); 
}

---

您应该使用jQuery而不是onclick属性：

<input type="button" value="1" id="one" class="clickable"/>
<input type="button" value="2" id="two" class="clickable"/>
<input type="button" value="3" id="three" class="clickable"/>

<script type='text/javascript'>
$('.clickable').on('click', function(){
    var $this = $(this); 
    alert(but.prop("id")); 
});
</script>

$（'.clickable'）。在（'click'，function（）上{
var$this=$（this）；
警报（但是，道具（“id”）；
});

您应该使用jQuery而不是onclick属性：

<input type="button" value="1" id="one" class="clickable"/>
<input type="button" value="2" id="two" class="clickable"/>
<input type="button" value="3" id="three" class="clickable"/>

<script type='text/javascript'>
$('.clickable').on('click', function(){
    var $this = $(this); 
    alert(but.prop("id")); 
});
</script>

$（'.clickable'）。在（'click'，function（）上{
var$this=$（this）；
警报（但是，道具（“id”）；
});

（函数（$）{
$（函数（）{
var A=函数（）{
var but=$（this.attr（“id”）；
警惕（但是）；
}
$（“.A按钮”）。单击（A）；
});
}（jQuery）

（函数（$）{
$（函数（）{
var A=函数（）{
var but=$（this.attr（“id”）；
警惕（但是）；
}
$（“.A按钮”）。单击（A）；
});
}（jQuery）

---

jQuery方式™ 绑定事件的定义是通过：

---

但是，如果要完成所有这些工作，为什么需要jQuery呢？此外，这些内联事件绑定很难维护，因为存在明显的代码重复。

jQuery方式™ 绑定事件的定义是通过：

---

但是，如果要完成所有这些工作，为什么需要jQuery呢？此外，这些内联事件绑定很难维护，因为存在明显的代码重复。

使用

this

作为

a（）

的参数的解决方案是可以的，但在我看来，最好不要使用

onclick

属性并将单击处理程序逻辑与HTML解耦：

<input type="button" value="1" id="one"/>
<input type="button" value="2" id="two"/>
<input type="button" value="3" id="three"/>

<script type="text/javascript">
    $(document).ready(function() {
        $('input[type="button"]').click(function(event) {
            alert(event.target.id);
        });
    });
</script>

$（文档）.ready（函数（）{
$（'input[type=“button”]”）。单击（函数（事件）{
警报（event.target.id）；
});
});

---

还请注意，您还可以对所有按钮使用css类，并将其与jquery一起使用，以查询要将单击处理程序附加到的按钮。

使用

this

作为

a（）的参数的解决方案是可以的，但在我看来，最好不要使用
onclick
属性，并将单击处理程序逻辑与HTML分离：

<input type="button" value="1" id="one"/>
<input type="button" value="2" id="two"/>
<input type="button" value="3" id="three"/>

<script type="text/javascript">
    $(document).ready(function() {
        $('input[type="button"]').click(function(event) {
            alert(event.target.id);
        });
    });
</script>


$（文档）.ready（函数（）{
$（'input[type=“button”]”）。单击（函数（事件）{
警报（event.target.id）；
});
});

还请注意，您还可以对所有按钮使用css类，并将其与jquery一起使用，以查询要将单击处理程序附加到的按钮。
在您的示例中，这指向窗口对象，而不是按钮。因此，要么将button对象传递给函数调用（如其他答案中所建议的），要么使用jQuery将click事件绑定到按钮。如果你做了后一个，那么我想这会像你期望的那样指向按钮

例如：
$（“#一”）。单击（…）
$（“#两”）。单击（…）
$（“#三”）。单击（…）
在您的示例中，这指向窗口对象，而不是按钮。因此，要么将button对象传递给函数调用（如其他答案中所建议的），要么使用jQuery将click事件绑定到按钮。如果你做了后一个，那么我想这会像你期望的那样指向按钮

例如：
$（“#一”）。单击（…）
$（“#两”）。单击（…）
$（“#三”）。单击（…）
另一种选择

function A(obj){
alert(obj.getAttribute("id");
}

这是一种获取javascript事件绑定的任何对象id的简单方法。你错过了必须这样通过的论点

<input type="button" value="3" id="three" onclick="return A(this);"/>

function A(obj){
    var but = obj.id; 
    alert(but); 
}

<input type="text" onclick="A(this)" />



此指针指向对象本身并作为参数传递，而getAttribute可帮助您获取id
另一个选项

function A(obj){
alert(obj.getAttribute("id");
}

这是一种获取javascript事件绑定的任何对象id的简单方法。你错过了必须这样通过的论点

<input type="button" value="3" id="three" onclick="return A(this);"/>

function A(obj){
    var but = obj.id; 
    alert(but); 
}

<input type="text" onclick="A(this)" />



这个指针指向对象本身并作为参数传递，而getAttribute帮助您获取id，我看到您正在使用jQuery。为什么不尝试使用jQuery的事件处理呢。我经常这样做，你的代码是一种非常古老的javascript代码风格

您可以为所有输入元素提供一个类：

<input type="button" value="1" id="one" class="dothebtnthing" />
...

这应该行得通

<input type="button" value="1" id="one" onclick="return A();"/>
<input type="button" value="2" id="two" onclick="return A();"/>
<input type="button" value="3" id="three" onclick="return A();"/>

<script type='text/javascript'>

function A(){
    var but = $(this).attr("id"); 
    alert(but); 
}    
</script>

jQuery还支持自定义的“数据”属性，这些属性允许更容易地将数据扩展到文档对象，即

<input type="button" value="1" data-id="one" class="dothebtnthing" />
...

生成相同的结果。
我看到您正在使用jQuery。为什么不尝试使用jQuery的事件处理呢。我经常这样做，你的代码是一种非常古老的javascript代码风格

<input type="button" value="1" id="one" onclick="return A(this);"/>
<input type="button" value="2" id="two" onclick="return A(this);"/>
<input type="button" value="3" id="three" onclick="return A(this);"/>

<script type='text/javascript'>
function A(e){
    var but = e.id; 
    alert(but); 
}
</script>

您可以为所有输入元素提供一个类