Question

我试图通过onclick功能在文件夹中的两个图像之间切换。目前我的代码没有切换图像，我没有控制台错误，所以我不知道为什么没有发生切换。我的文件夹看起来像这样：

program-01
    program01.index
    program01javascript
        program01script.js
    program01css
    images
        LightOff.png
        LightOn.png

HTML

<div>
    <img src="images/LightOff.png" id="light" onclick="DateTime(); imageSwap();" />
    <p id="date_time"></p>
</div>

的Javascript

function imageSwap(){
    var img = document.getElementById("light") ;
    if (img.src == "images/LightOff.png"){
        img.src = "images/LightOn.png";
    } else {
        img.src = "images/LightOff.png";
    }
}

我认为它与我的文件路径有关，或与.src属性有关，但不确定究竟是什么问题。

Answer 1

这个怎么样？

img.src将返回绝对网址，我建议您使用标记而不是图片src

var status = false;
function imageSwap() {
    var img = document.getElementById("light");
    if (!status) {
        img.src = "images/LightOn.png";
        status = true;
    } else {
        img.src = "images/LightOff.png";
        status = false;
    }
}

或者按照自己的方式行事，使用getAttribute

function imageSwap(){
    var img = document.getElementById("light") ;
    if (img.getAttribute('src') == "images/LightOff.png"){
        img.src = "images/LightOn.png";
    } else {
        img.src = "images/LightOff.png";
    }
}

通过onclick问题javascript切换图像

1 个答案: