所以我有两个箭头图像,我需要在点击(下拉菜单排序)之间切换。
首次单击该按钮可更改图像,但第二次单击不会执行任何操作。
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block') {
e.style.display = 'none';
} else {
e.style.display = 'block';
}
}
function toggle_img(img) {
var i = document.getElementById(img);
if(i.src = '/Images/arrow1_unclicked.png') {
i.src = '/Images/arrow1_clicked.png';
} else {
i.src = '/Images/arrow1_unclicked.png';}
}
}
<h1 id="headerSports" onclick="toggle_visibility('hiddenSports'), toggle_img('arrow')">
Sports <img id="arrow" src="/Images/arrow1_unclicked.png"/>
</h1>
<div id="hiddenSports" class="hiddenText">
<h2 onclick="toggle_visibility('hiddenNetball')">Netball</h2>
<h3 id="hiddenNetball" class="hiddenText">Netball</h3>
<h2 onclick="toggle_visibility('hiddenFootball')">Football</h2>
<h3 id="hiddenFootball" class="hiddenText">Football</h3>
<h2 onclick="toggle_visibility('hiddenHockey')">Hockey</h2>
<h3 id="hiddenHockey" class="hiddenText">Hockey</h3>
<h2 onclick="toggle_visibility('hiddenTennis')">Tennis</h2>
<h3 id="hiddenTennis" class="hiddenText">Tennis</h3>
<h2 onclick="toggle_visibility('hiddenBadminton')">Badminton</h2>
<h3 id="hiddenBadminton" class="hiddenText">Badminton</h3>
<h2 onclick="toggle_visibility('hiddenRugby')">Rugby</h2>
<h3 id="hiddenRugby" class="hiddenText">Rugby</h3>
</div>
答案 0 :(得分:1)
您的if条件是使用单个“=”而是使用“==”或“===”进行比较
答案 1 :(得分:0)
这是你想要达到的目标吗? https://jsfiddle.net/oakley808/eje1rof4/
var unclicked = 'https://pbs.twimg.com/profile_images/378800000563115809/b5bfa0c4b2e8670d09222c17856abef4.jpeg'
var clicked = 'http://www.heromachine.com/wp-content/uploads/2012/12/smily-face.jpg'
function toggle_visibility(img) {
var e = document.getElementById(img)
if (e.style.display == 'block') {
e.style.display = 'none'
} else {
e.style.display = 'block'
}
}
function toggle_img(img) {
var i = document.getElementById(img)
if (i.src == unclicked ) {
i.src = clicked
} else {
i.src = unclicked
}
}