2017-04-12 9 views
0

これで、見るべき映画を決定するのに役立つアプリを作成しています。このアプリの機能の1つは、選択したジャンルに基づいてムービーをランダムに表示するランダムボタンですが、画像の表示方法はわかりません。私はこれまで何を持っていたのかを知っている。ありがとうございました!配列からランダムな画像を表示するには

<body> 
    <button id='randomBut'>RANDOMIZE</button> 
       <div id='movieImg'><img src='movie1.svg'></div> 
</body 
<script> 
var randomizer = document.getElementById("randomBut"); 
var randimg = document.getElementById("movieImg"); 
var movieimages = ["movie1.svg", "movie2.svg", "movie3.svg"]; 

document.getElementById("movieImg").innerHTML = movieimages; 

randomizer.addEventListener("click", function(){ 
var randimg = document.createElement("img"); 
randimg.src = "movieimages" ; 

</script> 
+0

SRC画像に割り当てます。 –

答えて

0

画像にidを置き、乱数ジェネレータを作成します。その乱数を使用して、配列から画像を選択します。次に、配列からランダムな文字列を選んでそれを使用

<button id='randomBut'>RANDOMIZE</button> 
 
<div><img id='movieImg' src='http://placehold.it/100x100'></div> 
 

 
<script> 
 
    var randomizer = document.getElementById("randomBut"); 
 
    var randimg = document.getElementById("movieImg"); 
 
    var movieimages = ["http://placehold.it/100x100", "http://placehold.it/150x100", "http://placehold.it/100x150"]; 
 

 
    randomizer.addEventListener("click", function(){ 
 
    var randNum = Math.floor(Math.random() * movieimages.length) + 0 
 
    
 
    randimg.src = movieimages[randNum] ; 
 
    }); 
 

 
</script>

関連する問題