2017-12-14 22 views
3

ランダムに選択する必要がある画像URLの配列があります。imgタグのsrc属性に乱数変数を含める方法

var imagesArray = [ 
     "http://img/img_0.jpg" 
    , "http://img/img_1.jpg" 
    , "http://img/img_2.jpg" 
    , "http://img/img_3.jpg" 
    , "http://img/img_4.jpg" 
    , "http://img/img_5.jpg" 

    ]; 
    var num = Math.floor(Math.random() * 6); // 0...6 
    var num1 = Math.floor(Math.random() * 6); // 0...6 
    var num2 = Math.floor(Math.random() * 6); // 0...6 

しかし、その代わりに画像番号の、私はこのような私のイメージタグのsrcに0から5までの乱数を含める必要があります。

<img src="http://img/img_[num].jpg" name="canvas" /> 

が、[NUM]は動作しません。

HTML

<form name="imageForm" class="form1"> 
    <table> 
    <tr> 
    <td> 
     <input onclick="displayImage();" type=button value="Display Random Image"> 
    </td> 
    </tr> 
    <tr> 
    <td> 
     <img src="http://img/img_[num].jpg" name="canvas" /> 
    </td> 


    <td> 
     <img src="" name="canvas1" /> 
    </td> 


    <td> 
     <img src="" name="canvas2" /> 
    </td> 
    </tr> 
    </table> 
</form> 
+0

あなたはここではJavaScriptを使用する必要があります。例: 'img.src =" http:// img/img_ "+ num +" .jpg ";' –

+0

[JavaScriptで2つの数字の間に乱数を生成する]の複製があります(https://stackoverflow.com/questions/4959975 2つの数字の間の乱数を生成する) –

+0

@ Madhavan.VIはそれが – Swellar

答えて

2

Here is the fiddle。その後、スクリプト

<img id="img1" src="" name="canvas" /> 

var img1=document.getElementById("img1"); 
    img1.src="http://img/img_"+num+".jpg"; 
+1

u ..これは私が探していたものでしたありがとうございました –

+0

@ jojo li –

関連する問題