zoukankan      html  css  js  c++  java
  • JavaScript经典实例

    1. 创建确认对话框

    <html>
    <head>
    <meta charset="utf-8" />
    <title>确认对话框创建示例</title>
    <script type="text/javascript">
      function isConfirm(){
      if(confirm("are you sure?"))
        alert("ok!");
      else
        alert("cancel!");
      }
    </script>
    </head>
    <body>
      <form method="post" name="form1">
        <input type="button" value="delete" onclick="isConfirm()" />
      </form>
    </body>
    </html>

    2. 使用Math对应的random()方法实现随机排列图片

    <html>
    <head>
    <meta charset="utf-8" />
    <title>随机排列图片</title>
    <style type="text/css">
      /*以下是自适应屏幕宽度*/
      div{float: left; height: 160px; 160px; margin: 5px; padding: 0;}
      div img{border: 0;}
      div a{display: block;padding: 35px 12px;}
      div.vbg a{display: block;padding: 10px 35px 15px;}
      div.dispcenter{position: relative;margin: 0 auto; 700px; padding: 0 50px 0 70px;background: none;float: none;}
    </style>

    <script type="text/javascript" language="JavaScript">
      document.write("<div class='dispcenter'>")
      var picArr=new Array();
      var m=0;
      for(i=1;i<=20;i++){
        if(i<10)  i+="0";
        picArr.push(i);
      }
      while(picArr.length>0){
        i=Math.floor(Math.random()*(picArr.length-1));
        if(picArr[i]=="03" || picArr[i]=="04"|| picArr[i]=="06" || picArr[i]=="11" || picArr[i]=="14" || picArr[i]=="17" || picArr[i]=="19" || picArr[i]=="20"{
          document.write("<div class='vbg'><a href='photo/"+picArr[i]+".jpg'><img src+'photo/"+picArr[i]+".jpg' /></ a></div>");
        }else{  
          document.write("<div><a href='photo/"+picArr[i]+".jpg'><img src='photo/"+picArr[i]+".jpg' /></ a></div>");
         }
        picArr.splice(i,1);
      }
      document.write("</div>")
    </script>
    </head>
    <body>
    </body>
    </html>

    3.使用表单对象创建注册页面

  • 相关阅读:
    Oracle查询今天的数据(昨天、本周...)
    Windows添加删除 route
    大三寒假学习进度(九)
    大三寒假学习进度(八)
    大三寒假学习进度(七)
    大三寒假学习进度(六)
    大三寒假学习进度(五)
    《软件架构师应该知道的97件事》阅读笔记(一)
    大三寒假学习进度(四)
    大三寒假学习进度(三)
  • 原文地址:https://www.cnblogs.com/jacinthcc/p/4700199.html
Copyright © 2011-2022 走看看