当值= 0时，将“静音扬声器”图标链接到音量滑块？

Question

我的音量滑块旁边有一个扬声器图标，我想在音量值为0时将图标更改为第二个（静音）扬声器图标。我尝试了不同的变化，但没有奏效。我怎么做？谢谢！

function processPhase2(){
    age = _("age").value;
    if(age.length >= 1){
      _("phase2").style.display = "none";
      _("show_info").style.display = "block";
      _("display_fname").innerHTML = fname;
      _("display_lname").innerHTML = lname;
      _("display_age").innerHTML = age;
    }
    else {alert("Please Enter All Information");}
}

<div id="show_info">
  First Name : <span id="display_fname"></span><br>
  Last Name : <span id="display_lname"></span><br>
  Age : <span id="display_age"></span><br>
  <button onclick="submit()">submit</button>
</div>

var volumeslider;
volumeslider = document.getElementById("volumeslider");
	// Add Event Handling
	volumeslider.addEventListener("mousemove", setvolume);
	// Functions
	function setvolume(){
	    audio.volume = volumeslider.value / 100;
    }

Answer 1

使用JQs attr方法只交换图像源。此外，如果您使用的是外部JS文档，请确保图像的src路径相对于HTML文档。

<强> JS：

 volumeslider.addEventListener("mousemove", checkMute); 

//每次拖动滑块时检查静音。

function checkMute(){
    if (audio.volume == 0){
        $( ".speaker" ).attr("src", "images/speaker.png");
    }else{
        $( ".speaker" ).attr("src", "images/speakermute.png");
    }
}