javascript - 图像仅改变一次

Question

所以我有两个箭头图像，我需要在单击时在它们之间切换(下拉菜单之类的东西)。

第一次单击按钮会更改图像，但第二次单击不会执行任何操作。

<div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>    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';}
    	}
    }</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>    <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></code></pre>
</div>
</div>

Answer 1

您的 if 条件使用单个“=”而不是使用“==”或“===”进行比较