ドロップダウンの画像を変更するjavascript/jquery、フィドルで作業しますが、他の場所では動作しませんか？

私の人生は、これを動作させることができません。私はドロップダウンメニューを変更すると、別のイメージを表示しようとしています。それは変わらない、それは問題です。ドロップダウンの画像を変更するjavascript/jquery、フィドルで作業しますが、他の場所では動作しませんか？

私はdocreadyで何かをする必要がありますが、何がわからないのですか？

<html> 
<head> 
    <script src="/js/jquery-1.11.2.js"></script> 
    <script type="text/javascript"> 
    var pictureList = [ 
     "http://lorempixel.com/400/200/sports/1", 
     "http://lorempixel.com/400/200/sports/2", 
     "http://lorempixel.com/400/200/sports/3", 
     "http://lorempixel.com/400/200/sports/4", 
     "http://lorempixel.com/400/200/sports/5", ]; 

    $(document).ready(function() { 
    $('#picDD').change(function() { 
     var val = parseInt($('#picDD').val()); 
     $('img').attr("src",pictureList[val]); 
    }); 
}); 

    </script> 
</head> 
<body> 
    <img src="http://lorempixel.com/400/200/sports/1" /> 
    <select id="picDD"> 
     <option value="1" selected>Picute 1</option> 
     <option value="2">Picute 2</option> 
     <option value="3">Picute 3</option> 
     <option value="4">Picute 4</option> 
     <option value="5">Picute 5</option> 
    </select> 
</body> 
</html>

試しました。

$(document).ready(function() { 
    var pictureList = [ 
     "http://lorempixel.com/400/200/sports/1", 
     "http://lorempixel.com/400/200/sports/2", 
     "http://lorempixel.com/400/200/sports/3", 
     "http://lorempixel.com/400/200/sports/4", 
     "http://lorempixel.com/400/200/sports/5", ]; 


    $('#picDD').change(function() { 
     var val = parseInt($('#picDD').val()); 
     $('img').attr("src",pictureList[val]); 
    }); 
}); 

    </script> 
</head> 
<body> 
    <img src="http://lorempixel.com/400/200/sports/1" /> 
    <select id="picDD"> 
     <option value="1" selected>Picute 1</option> 
     <option value="2">Picute 2</option> 
     <option value="3">Picute 3</option> 
     <option value="4">Picute 4</option> 
     <option value="5">Picute 5</option> 
    </select> 
</body> 
</html>

出典

2016-05-03 ohdust

私の答えにはコードがありますか？ –

コードがjsFiddleで働いている理由は、jsFiddleはあなたのJavaScriptに暗黙のonLoadラッパーを追加することです。そのラッパーなし

、あなたが困っています。これを修正するにはpictureListアレイを$(document).ready(function() {}の内部に移動してください。

jsFiddleデモでは、ウェブページ自体は安全ですが（https）、リクエストしているイメージが安全でないサーバーから来ているため、混在したコンテンツの警告も表示されます。セキュアイメージを格納するようにpictureListアレイを変更すると、速度が大幅に向上します。たとえば、配列pictureListにこれを使用してみてください。

var pictureList = [ 
    "https://i.ytimg.com/vi/tntOCGkgt98/maxresdefault.jpg", 
    "https://www.petfinder.com/wp-content/uploads/2012/11/140272627-grooming-needs-senior-cat-632x475.jpg", 
    "https://upload.wikimedia.org/wikipedia/commons/4/4d/Cat_March_2010-1.jpg", 
    "https://upload.wikimedia.org/wikipedia/commons/1/1e/Large_Siamese_cat_tosses_a_mouse.jpg", 
    "https://www.petfinder.com/wp-content/uploads/2013/09/cat-black-superstitious-fcs-cat-myths-162286659.jpg" 
    ];

出典

2016-05-03 21:48:44

私は自分の持っているものを更新しましたが、まだ動作しません。私はドキュメント内のpictureListを準備しました。 – ohdust

私は今それをテストします。 –

ありがとうございました。 :) – ohdust

ドロップダウンの画像を変更するjavascript/jquery、フィドルで作業しますが、他の場所では動作しませんか？

答えて

関連する問題