問題已解決,是瀏覽器的問題,感謝您的幫助
我有一個 HTML\JS\CSS 學校專案,在這個頁面中,我想創建一個函式來更改出現的影像。但似乎程式中存在問題,誰能幫我知道究竟是什么問題
function changeImage(img) {
path = img.options[img.selectedIndex].value;
document.getElementById('image').src = path;
}
<select onchange="changeImage(this)">
<option value="image3.png" selected>image3</option>
<option value="image2.png">Boston image2</option>
<option value="image1.png">Brooklyn image1</option>
</select>
<img src="image1.png" id="image">
uj5u.com熱心網友回復:
您可以使用以下代碼為所有瀏覽器提供支持:
function changeImage(img) {
path = img.value || img.options[target.selectedIndex].value;
document.getElementById('image').src = path;
}
uj5u.com熱心網友回復:
將初始加載時的影像設定為第一個選項
function changeImage(img) {
path = img.options[img.selectedIndex].value;
document.getElementById('image').src = path;
}
<select onchange="changeImage(this)">
<option value="https://via.placeholder.com/50" selected>image3</option>
<option value="https://via.placeholder.com/75">Boston image2</option>
<option value="https://via.placeholder.com/100">Brooklyn image1</option>
</select>
<img src="https://via.placeholder.com/50" id="image">
uj5u.com熱心網友回復:
<select onchange="changeImage()">
<option value="select option" selected>Select Option</option>
<option value="image3.png" id="image3">image3</option>
<option value="image2.png" id="image2">image2</option>
<option value="image1.png" id="image1">image1</option>
</select>
<!-- Img Show Will Be Here -->
<img id="img">
<script>
function changeImage() {
if(document.getElementById("image3").selected == true) {
document.getElementById("img").src = "your image"
}
if(document.getElementById("image2").selected == true) {
document.getElementById("img").src = "your image";
}
if(document.getElementById("image1").selected == true) {
document.getElementById("img").src = "your image"
}
}
</script>
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/462685.html
標籤:javascript html 图片
