我有一个游戏,其中有气球,每个气球都有一个 onclick
属性,该属性将 id 传递到 JS 函数以更改 css。
示例:
<div id="balloon" class="container" onclick="popBalloon(this.id);"></div>
点击此项将调用下面的函数
function popBalloon(id){
document.getElementById(id).setAttribute("class","pop");
}
问题是我有多个相同类型的气球,我想要一种方法来确定使用相同属性名称单击的特定气球,而不是为每个气球使用唯一的 ID。
这可能吗?
最佳答案
如果将 event
作为函数参数传递,则可以使用 event.target
获取点击的元素
function popBalloon (event) {
event.target.setAttribute("class", "pop");
}
div {
margin-top: 10px;
height: 30px;
width: 30px;
border: 1px solid;
border-radius: 50%;
}
.container {
background-color: red;
}
.pop {
background-color: blue;
}
<div class="container" onclick="popBalloon(event);"></div>
<div class="container" onclick="popBalloon(event);"></div>
<div class="container" onclick="popBalloon(event);"></div>
<div class="container" onclick="popBalloon(event);"></div>
<div class="container" onclick="popBalloon(event);"></div>
关于javascript - 如何在不创建单独的 id 的情况下对多个项目使用一个函数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59460640/