以下是一个解决上述问题的示例代码:
HTML代码:
JavaScript代码:
function changeValue() {
// 获取被点击的按钮的索引
var index = Array.from(document.getElementsByTagName("button")).indexOf(event.target);
// 获取按钮的显示值
var displayValue = event.target.innerHTML;
// 判断索引与显示值是否相同
if (index !== displayValue) {
// 显示索引
document.getElementById("output").innerHTML = "按钮" + (index + 1) + "被点击";
} else {
// 显示错误信息
document.getElementById("output").innerHTML = "按钮" + (index + 1) + "显示的值与索引不同";
}
}
上述代码中,我们首先给每个按钮添加了一个相同的onclick事件处理函数changeValue()
。在该函数中,我们通过indexOf()
方法获取被点击按钮的索引,并通过innerHTML
属性获取按钮的显示值。然后,我们判断索引与显示值是否相同,如果不同,将显示按钮的索引,否则显示错误信息。最后,我们通过innerHTML
属性将结果显示在元素中。
请注意,上述代码假设所有按钮的显示值为按钮的索引。如果按钮的显示值是其他值,你需要相应地更改判断条件。
下一篇:按钮的图像旋转动画