当页面上的多个按钮具有相同的选择器时，检查究竟点击了什么按钮

Question

我有两个带有相同选择器的按钮 class。当我这样做时：

$('.my_button').click(function() {
    console.log(1);
});

，然后单击它记录 1 的按钮两次，就像我单击两个按钮而不是单个按钮一样。所以我的问题是：在 JS 中存在一些方法可以只获取我单击的那个按钮，而不分配像 id 这样的唯一选择器。我是 JS 的新手，所以有人可以解释一下吗？我发现了相关问题 here。谢谢！

编辑：

我做的按钮有点不同。是的，它 returns 只有一个按钮，但为什么点击触发器会工作两次。控制台日志日志两次。

Answer 1

在您的函数代码中使用 this

$('.my_button').on('click',function() {
    var tempContainer=$(this).parent();
    alert($(tempContainer).html());   // you ll see that you are showing the code where exists your clicked button
});

Answer 2

每个事件监听器都会接收到事件，事件中携带了事件目标。试试下面的例子。

$('.my_button').click(function(e) {
    console.log(e);
    console.log(e.currentTarget);
    console.log($(e.currentTarget));
});

Answer 3

试试这个：

<button class="my_button">Content1</button>
<button class="my_button">Content2</button>

<script>
$( ".my_button" ).click(function( event ) {
console.log(1);
});
</script>

https://jsfiddle.net/nt9ryeyr/5/

Answer 4

试试这个：-

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(".p").click(function(e){
        alert($(e.currentTarget).attr("value"));//button text on which you clicked
    });
});
</script>
</head>
<body>

<input type='button' class="p" value='test'/>

</body>
</html>

Answer 5

如果你的html是这样的

<button class="my_button">Test</button>
<button class="my_button">Test1</button>

然后使用这个脚本

$('.my_button').click(function() {
if(this.innerHTML ==="Test")
    console.log(1);
else
console.log(2);
});

或者如果你的html是这样的

<input type="button" class="my_button" value="Test"/>
<input type="button" class="my_button" value="Test1"/>

然后使用这个脚本

$('.my_button').click(function() {
if($(this).val() ==="Test")
    console.log(1);
else
console.log(2);
});

Answer 6

为您的按钮分配不同的 ID

 <input type="button" class="my_button" id="test" value="Test"/>
 <input type="button" class="my_button" id="test2" value="Test1"/>

 alert($(this).attr("id"));

当页面上的多个按钮具有相同的选择器时，检查究竟点击了什么按钮

Check what exatly button clicked, when multiple buttons with the same selector on page

javascript

jquery

onclick