javascript - 同じページにコンボボックスの値に基づいて画像を表示する

Question

画像の表示方法はコンボボックスで選択した値によって異なり、画像はコンボボックスの近くの同じページに表示されます...よろしくお願いします...

Answer 1

onchangewith selectin htmlを使用する必要があります。あなたを使用してそれを成し遂げるJavascriptことができます。例は以下のようになります。JavaScript 関数で選択した値を確認し、表示する画像を決定するだけです。値を比較しましたが、イメージ名自体を使用することもできます。

<select name="number" id="course" style="width:158px;" onchange="getImage(this)">
  <option value="none">----Select ----</option>
  <option >1</option>
  <option >2</option>  
</select>
<img id="imgt" src="default.jpg" width="300" height="300"/>


<script type="text/javascript">
    function getImage(v) {
        var num = v.value;
        alert(num);
        if(num==1) {
            document.getElementById("imgt").setAttribute("src","image1.jpg");
        }
        else {
            document.getElementById("imgt").setAttribute("src","image2jpg");    
        }
    }
</script>