js设置点击事件获取每个button的值
时间: 2024-04-22 13:28:24 浏览: 160
要点击事件并获取每个button值,你可以使用来为每个button元素添加事件监听器。在事件处理函数中,你可以通过`this.value`来获取被点击的button元素的值。以下是一个示例代码:
```javascript
// HTML
<button class="myButton" value="Button 1">Button 1</button>
<button class="myButton" value="Button 2">Button 2</button>
<button class="myButton" value="Button 3">Button 3</button>
// JavaScript
var buttons = document.getElementsByClassName("myButton");
for (var i = 0; i < buttons.length; i++) {
buttons[i].addEventListener("click", function() {
var buttonValue = this.value;
console.log(buttonValue);
});
}
```
在上述代码中,我们首先使用`document.getElementsByClassName()`方法获取所有class为"myButton"的button元素的引用,并将其存储在`buttons`变量中。然后,使用`for`循环为每个button元素添加点击事件监听器。在事件处理函数中,使用`this.value`来获取被点击的button元素的值,并将其存储在`buttonValue`变量中。最后,我们通过`console.log()`将每个button的值输出到控制台。
当你点击任何一个button时,对应的值将被打印到控制台中。你可以根据你的实际需求对获取到的值进行进一步处理。
阅读全文