0

オプションが選択されたときに画像を変更する必要がある選択リストがあります。私は次のコードを持っています：

<select id="p1_choise" onchange="change(image)">
  <option value=0>Choose</option>
  <option value=1>Rock</option>
  <option value=2>Paper</option>
  <option value=3>Scissors</option>
</select>

<p><img src="rps.jpg" id="image"></p>

そして、私の.psファイルにこれがあります：

function change(image) {
    var icon = document.getElementById("p1_choise").value;
    switch (parseInt(icon)) {
        case 1: document.getElementById(image).src="rock.jpg"; break;
        case 2: document.getElementById(image).src="paper.jpg"; break;
        case 3: document.getElementById(image).src="scissors.jpg"; break;
    }
}

しかし、私は取得し続けます

Uncaught TypeError：nullのプロパティ'src'を設定できません

imageパラメータは、変更する画像を関数に指示します。変更される可能性のある他の画像があります。

パラメータを正しく渡すにはどうすればよいですか？

ありがとう！

4

4 に答える 4

0

割り当てでは、要素onchangeのid値、つまり文字列を指定する必要があります。imgしたがって、引数を引用する必要があります。

<select id="p1_choise" onchange="change('image')">
  <option value=0>Choose</option>
  <option value=1>Rock</option>
  <option value=2>Paper</option>
  <option value=3>Scissors</option>
</select>
于 2012-11-07T11:42:10.063 に答える
0

関数document.getElementById内の画像要素を取得するために使用しますchange

<select id="p1_choise" onchange="change()">
  <option value=0>Choose</option>
  <option value=1>Rock</option>
  <option value=2>Paper</option>
  <option value=3>Scissors</option>
</select>

<p><img src="rps.jpg" id="image"></p>

JS：

    function change() {
       var image = document.getElementById("image");
        var icon = document.getElementById("p1_choise").value;
        switch (parseInt(icon)) {
            case 1: image.src="rock.jpg"; break;
            case 2:image.src="paper.jpg"; break;
            case 3: image.src="scissors.jpg"; break;
        }
    }
于 2012-11-07T11:36:01.897 に答える
-1

より一般的なjs関数は次のようになります（select要素とimage要素を指定できます）

<select id="p1_choise" onchange="change(this,document.getElementById('image'))">
  <option value=0>Choose</option>
  <option value=1>Rock</option>
  <option value=2>Paper</option>
  <option value=3>Scissors</option>
</select>

<p><img src="rps.jpg" id="image"></p>

<script>
function change(options,imageElement) {
    var icon = options.value;
    switch (parseInt(icon)) {
        case 1: imageElement.src="rock.jpg"; break;
        case 2: imageElement.src="paper.jpg"; break;
        case 3: imageElement.src="scissors.jpg"; break;
    }
}
</script>
于 2012-11-07T11:37:10.133 に答える
-1 
<select id="p1_choise" onchange="change(this)">
  <option value=0>Choose</option>
  <option value=1>Rock</option>
  <option value=2>Paper</option>
  <option value=3>Scissors</option>
</select>

<p><img src="rps.jpg" id="image"></p>

function change(this) {
    var icon = this.value;
    switch (parseInt(icon)) {
        case 1: document.getElementById("image").src="rock.jpg"; break;
        case 2: document.getElementById("image").src="paper.jpg"; break;
        case 3: document.getElementById("image").src="scissors.jpg"; break;
    }
}
于 2012-11-07T11:39:52.890 に答える