私はこのJavaScriptの画像表示コードの助けが必要です

-2

これは私が現在取り組んでいるコードです：開始画像（緑色が望ましい）を表示し、ボタンをクリックするたびに画像を信号に変更する必要がありますそれからそれが始まらなかった他のイメージに。例えばそれは、その後戻っなどのオレンジに、次に赤、オレンジ緑色から行く必要私はこのJavaScriptの画像表示コードの助けが必要です

<!DOCTYPE html/> 
    <html> 
    <script type="text/javascript"> 
    var trafficlight = []; 
    trafficlight [0] = " http://4vector.com/i/free-vector-traffic-light-green- clip-art_117820_Traffic_Light_Green_clip_art_medium.png "; 
    trafficlight [1] = "http://www.clker.com/cliparts/8/1/7/4/11949849782053089133traffic_light_yellow_ dan_01.svg.med.png "; 
    trafficlight [2] = "http://www.clker.com/cliparts/1/f/a/2/11949849771043985234traffic_light_red_dan_ge_01.svg.med.png "; 

    var num = 0; 

    function changepic() 
    { 

     if (num>=trafficlight.length-1){ 
     num=0; 
     } 
     num=num+1; 
     document.trafficlight.src=trafficlight[num]; 
    } 

    </script> 
    </head> 

    <body> 
    <center> 
    <img src ="http://4vector.com/i/free-vector-traffic-light-green-clip- art_117820_Traffic_Light_Green_clip_art_medium.png" name="trafficlightpic" width="400" height="400" /> 
    <p><A href="javascript:changepic();">click here</A></p> 
    </center> 
    </body> 
    </html>

出典

2016-06-22 c.hales420

すべての権利？質問は何ですか？期待どおりに動かなかったのは何ですか？ – Rayon

document.trafficlightは存在しません。必要なのは、

document.getElementById("trafficlightpic").src=trafficlight[num];

です。 img要素のname=""をid=""に変更する必要があります。それはうまくいくはずです。

出典

2016-06-22 11:42:19

if文の前にnum = num + 1を置きます。 –

交通標識のURL [0]をチェックします。私はtheresが間違いだと思う。自分でデバッグしてみてください。スクリプトの複数の箇所でconsole.log（ "test"）を追加し、ブラウザの動作を観察します –

Jonas Wが指摘したように、間違った参照を使用してイメージを返信しようとしています。 idを使ってやるか、名前を使ってやることができます。名前を使用している場合は、投稿の後に[0]を付けて参照する必要があります。これは、名前で要素を取得すると、オブジェクトのような配列が返されるためです。それの最初の項目。また、オレンジ色の画像srcが壊れています。フォローは機能し、srcをスワップすることができます（ただし、黄色のライトイメージは表示されません）。

var trafficlight = ["http://4vector.com/i/free-vector-traffic-light-green-clip-art_117820_Traffic_Light_Green_clip_art_medium.png","http://www.clker.com/cliparts/8/1/7/4/11949849782053089133traffic_light_yellow_dan_01.svg.med.png","http://www.clker.com/cliparts/1/f/a/2/11949849771043985234traffic_light_red_dan_ge_01.svg.med.png"]; 
 

 
function changepic() 
 
{ 
 
    var imageSrc=document.getElementsByName('trafficlightpic')[0].src; 
 
    var num =trafficlight.indexOf(imageSrc); 
 
    if (num >= trafficlight.length-1){num=-1;} 
 
    num+=1; 
 
    document.getElementsByName('trafficlightpic')[0].src=trafficlight[num]; 
 
}

<center> 
 
    <img src ="http://4vector.com/i/free-vector-traffic-light-green-clip- art_117820_Traffic_Light_Green_clip_art_medium.png" name="trafficlightpic" width="400" height="400" /> 
 
    <p onclick="changepic();">click here</p> 
 
    </center>

出典

2016-06-22 11:43:28 gavgrif

私はこのJavaScriptの画像表示コードの助けが必要です

答えて

関連する問題