Javascript：使用函數時圖像不會改變

Question

<img id="viewport" src="wEBgIFS/real_animation0.gif" class="img-responsive">

 <textarea id="user_entry" class="form-control" placeholder="Type here...">
            </textarea>
            <button id="sub-button" onClick="check_text('user_entry')" type="button" class="btn btn-primary btn-block" > Submit</button>



var display_text = new Array("Say ('Yes')","bag =['wand of wander','fist of fortitude','gun of colour']","bag.remove('wand of wander')","While: ");

var display_counter = 0;

var entry_text =1;


function check_text(id){
if (document.getElementById(id).value.trim() == display_text[display_counter]){
    display_counter ++;
    entry_text ++;

    //var n = display_counter.toString();


    switch(display_counter){
        case 1:
            document.getElementById("viewport").src="wEBgIFS/real_animation1.gif"
            break;


    }


}
}

上面的代碼是我嘗試用來更改的圖像，如果用戶輸入與存儲的正確答案匹配的話。 問題是，盡管圖像的來源屬性發生了變化，但是盡管來源是正確的，但還是使用舊的圖像代替了新的圖像，我一生都無法理解為什么。 我嘗試了其他一些圖像作為測試，但是效果很好，只是不允許我更改為新的gif圖像。

任何幫助，將不勝感激

Answer 1

嘗試這個：

<img id="viewport" src="/wEBgIFS/real_animation0.gif" class="img-responsive">

和：

    document.getElementById("viewport").src="/wEBgIFS/real_animation1.gif"