0

HTML ドロップダウン ボックスからの選択に基づいて画像を切り替えるスクリプトがあります。

HTMLは次のとおりです。

<form>
<select onChange="changeMap(this.value);">
<option value="clIP">Century Link - IP</option>
<option value="clND">Century Link - National Data</option>
<option value="elDF">Earth Link - Data Fiber</option>
<option value="elDSL">Earth Link - DSL</option>
<option value="l3">Level 3</option>
<option value="ws">Windstream</option>
<option value="xoBB">XO - BB</option>
<option value="xoFVOIP">XO - Flex VOIP</option>
<option value="xoIP">XO - IP</option>
</select>
</form>

<img src="imageurl" id="map" />

関連する JavaScript は次のとおりです。

var maps=new Array();

maps[0]="imageurl";
maps[1]="imageurl";
maps[2]="imageurl";
maps[3]="imageurl";
maps[4]="imageurl";
maps[5]="imageurl";
maps[6]="imageurl";
maps[7]="imageurl";
maps[8]="imageurl";

function changeMap(inobj) {

switch (inobj) {

case "clIP":
    document.getElementByID("map").src=maps[0];
    break;

case "clND":
    document.getElementByID("map").src=maps[1];
    break;

case "elDF":
    document.getElementByID("map").src=maps[2];
    break;

case "elDSL":
    document.getElementByID("map").src=maps[3];
    break;

case "l3":
    document.getElementByID("map").src=maps[4];
    break;

case "ws":
    document.getElementByID("map").src=maps[5];
    break;

case "xoBB":
    document.getElementByID("map").src=maps[6];
    break;

case "xoFOIP"
    document.getElementByID("map").src=maps[7];
    break;

case "xoIP"
    document.getElementByID("map").src=maps[8];
    break;

default:
    document.write('Please select a map from the menu.');
    break;
}

したがって、ユーザーがマップを選択するためのドロップダウン メニューを備えた非常に基本的な HTML があります。JavaScript を使用して、セレクターの値に基づいて画像 src を配列の値に変更します。私にはこのコードは問題ないように見えますが、単に機能していません。メニューは選択時に何もしません。ここで何が欠けていますか？

4

1 に答える 1

0

なぜこれに問題があるのか​​ わかりません-簡単なテストを行い、利用可能なすべてのブラウザー（最新のChrome、FF、およびIE）で完全に動作します：

<html>
    <head>
        <title>test 12010414</title>
        <script type="text/javascript">
function switchImg(){
    var nextImg = "http://sarahhorth.com/wp-content/themes/thesis_16/custom-sample/rotator/sample-4.jpg",
        testImg = document.getElementById("testimg");
    if(testImg){
        testImg.src = nextImg;
    }
}
        </script>
    </head>
    <body>
        <img id="testimg" src="http://whitenoisecd.org/wp-content/themes/thesis/rotator/sample-1.jpg" onclick="switchImg()"/>
    </body>
</html>
于 2012-08-17T17:54:33.230 に答える