- 此问题在此处已有答案**:
Radio button onclick not working(5个答案)
3天前关闭。
截至3天前,社区正在审查是否重新讨论此问题。
有点新,为什么不工作?我创建了两个按钮,一个是播放按钮图标,一个是向下箭头图标。按钮应该通过改变"class"属性切换到不同的按钮。我尝试了一些东西,但显然不工作。我想我的问题是我不知道如何声明div1
和div2
变量。
var div1 = document.getElementById("div1")
var div2 = document.getElementById("div2")
function updateButton() {
var className = div1.getAttribute("class");
if(className=="fa-solid fa-play") {
div1.className = "fa-solid fa-pause";
}
if(className=="fa-solid fa-pause") {
div1.className = "fa-solid fa-play";
}
}
function updateButton2() {
const div2 = document.getElementById(div2)
var className = div2.getAttribute("class");
if(className=="fa-solid fa-angle-down") {
div2.className = "fa-solid fa-angle-up";
}
if(className=="fa-solid fa-angle-up") {
div2.className = "fa-solid fa-angle-down";
}
}
<!DOCTYPE html>
<html>
<head>
<script src="https://kit.fontawesome.com/0055907593.js" crossorigin="anonymous"></script>
</head>
<body>
<div>
<button class="player__button toggle" title="Toggle Play"><i class="fa-solid fa-play" id="div1" onclick="updateButton"></i></button>
<button class="player__button toggle" title="Toggle Play"><i class="fa-solid fa-angle-down" id="div2" onclick="updateButton2"></i></button>
</div>
</body>
</html>
3条答案
按热度按时间nbnkbykc1#
您应该删除行
const div2 = document.getElementById(div2)
,因为div2已经是元素引用,或者将其替换为const div2 = document.getElementById("div2")
twh00eeo2#
因此,我会将
onclick...
移动到button
,而不是i
,然后添加()
将
onclick
留在i
上意味着只有在单击图像时才会发生更改(参见第二个按钮未更改,单击最角落不会更改第二个按钮,但第一个按钮会更改)fkvaft9z3#
两个小问题1)add()到你的函数调用。2)div2已经定义了。