如何在img标签

时间:2017-12-14 06:34:19

标签: javascript html image random

我有一系列图片网址,我需要随机选择。

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>

1 个答案:

答案 0 :(得分:2)

Here is the fiddle

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

然后脚本,

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