zoukankan      html  css  js  c++  java
  • 获取随机图片

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title></title>
    <style>
      *{
        padding: 0;
        margin: 0;
      }
      .imgbox img{
        margin-left: 10px;
        margin-top: 10px;
         200px;
        height: 100px;
      }
    </head>
    </style>
    <script src="jquery-2.1.0.js"></script>
    <body>

      <div class="imgbox">
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
        <img src="" alt="" />
      </div>

    <script>
    //随机取图片
    function randomErronImage(imgs){
      /*参数imgs代表你要显示的图片标签*/
      /*随机出图路径写成n 顺序出图路径写成index*/
      var index=0;
      for (var i = 0; i < imgs.length; i++) {
        var n=Math.floor(Math.random()*5);
        index++;
        if(index>4){
          index=0
        }
      $(imgs).eq(i).attr("src","img/"+index+".jpg"); //图片赋值
      //$(imgs).eq(i).attr("onerror","this.src='img/"+index+".jpg'") //在图片加载不出来的时候 显示默认图片
      }
    }
    randomErronImage($(".imgbox img"))

    </script>
    </body>
    </html

  • 相关阅读:
    点击按钮倒计时
    js实现-小框框全选
    CSS文字,文本,背景,盒模型等记录
    xps9560黑苹果展示
    面试——谈谈你对抽象和接口的理解(小知识大考点)
    谈谈你对Java 面向对象思想的理解
    谈谈你对Java 平台的理解
    HashMap1.7 问题总结
    2.3.2 InnoDB内存
    2.3 InnoDB 体系架构
  • 原文地址:https://www.cnblogs.com/menghui-guan/p/9606140.html
Copyright © 2011-2022 走看看