更改圖像src onchange og選擇

我試圖將圖像的src更改爲<select>中當前選定選項的值。我的功能如下所示;更改圖像src onchange og選擇

function changeImage() { 
    var gameValue = document.getElementById("select-games").value; 
    document.getElementById("select-game-picture").src = "img/game_" + gameValue + ".png"; 
}

我不是非常有經驗的JavaScript，所以我沒有任何線索，什麼可能是錯在這裏 - 我是混合從W3Schools的一些代碼，有的在這裏從＃1 - 改變了ID和這樣的，當然。

我的形象：

<img class="game-picture" alt="Logo of chosen game" id="select-game-picture" onchange="changeImage()">

有誰知道我做了什麼錯在這裏......？ :) 在此先感謝。

來源

2016-02-24 Albert MN.

onchange事件應與選擇元件不與圖像的約束。 –

謝謝@RajaprabhuAravindasamy！這解決了我的問題，如果你只是把這個作爲答案，我會標記它解決了:) –

您必須將onchange事件添加到select元素，而不是img元素。

實施例：

function changeImage() { 
 
    var gameValue = document.getElementById("select-games").value; 
 
    document.getElementById("select-game-picture").src = "img/game_" + gameValue + ".png"; 
 
}

<select id="select-games" onchange="changeImage()"> 
 
    <option value="game1">Game 1</option> 
 
    <option value="game2">Game 2</option> 
 
    <option value="game3">Game 3</option> 
 
    <option value="game4">Game 4</option> 
 
</select> 
 
<img class="game-picture" alt="Logo of chosen game" id="select-game-picture">

來源

2016-02-24 16:55:14

更改圖像src onchange og選擇

回答

相關問題