javascript - javascript函数每次刷新只运行一次变量吗？（开关：案例）

Question

我正在编写一个脚本，它运行一个函数来在按下按钮时更改图片。以下脚本第一次更改了图片，但下一次使用不同的变量运行相同的脚本时，它似乎没有考虑最新的变量。

<div id="main_img">
<center>
<button style="width:100;height:100" onClick="LastPic();"><---</button>
<img id="img" src="12.jpg" height=70% width=70%>
<button style="width:100;height:100" onClick="FirstPic();">---></button>
 </div>

<script>
var james = document.getElementById("img").getAttribute('src');

document.write(james);

function FirstPic() {
    switch (james) {
    case "12.jpg":
        document.getElementById("img").src = "13.jpg";
        break;

    case "13.jpg":
        document.getElementById("img").src = "14.jpg";
        break;


    default:
        alert('Default case');
        break;
    }
}
</script>

Answer 1

var james = document.getElementById("img").getAttribute('src');
document.write(james);

function FirstPic()
{
    // Get the new value every time the function is called
    james = document.getElementById("img").getAttribute('src');

    switch (james)
    {
        case "12.jpg":
            document.getElementById("img").src = "13.jpg";
            break;

        case "13.jpg":
            document.getElementById("img").src = "14.jpg";
            break;

        default: 
            alert('Default case');
            break;
    }
}

Answer 2

您正在全局级别语句中选择源属性

var james = document.getElementById("img").getAttribute('src');

只执行一次。

尝试在函数第一张图片中初始化

function FirstPic(){
    var james = document.getElementById("img").getAttribute('src');

    switch (james)
    {
       ....
    }
}

希望有帮助。:)