js實現(xiàn)轉(zhuǎn)動骰子模型

發(fā)布時間：2020-10-15 10:10:23 來源：腳本之家閱讀：153 作者：Danker01 欄目：web開發(fā)

本文創(chuàng)建了一個自動隨機生成骰子數(shù)的模型，因為需要引入圖片這里將圖片省去了，自己導(dǎo)入圖片即可驗證代碼

<!DOCTYPE html>
<html>
  <head>

    <meta charset="UTF-8">
    <title></title>
  </head>
  <body>
    <!--創(chuàng)建對象-->
    <div id="c1">
      <img src="img/img/sai3.png" />
    </div>
    <div id="c2">
      <img src="img/img/sai4.png" />
    </div>
  <div id="c5">
    <img src="img/img/sai5.png" />
  </div>
    <input type="button" value="開始" id="button1" onclick="tst()"/>
    <input type="button" value="停止" id="button2" onclick="stop()"/>
    <script type="text/javascript">
    //先獲取對象，并聲明一個全局變量，留給setTimeout（）函數(shù)使用
    var bt1=document.getElementById("button1");
    var bt2=document.getElementById("button2");
    var ims=document.getElementsByTagName("img");
    var a;
    //開始的函數(shù)
    function tst(){
      var num=Math.floor(Math.random()*6+1)
      for (var i=0;i<3;i++) {
        ims[i].src="img/img/sai"+num+".png";
      }a=setTimeout(tst,500);
      //點擊一次后，再次點擊沒有效果
      bt1.removeAttribute("onclick")
    }
    function stop(){
      clearTimeout(a)
      //點擊一次后，回復(fù)開始按鈕的功能
      bt1.setAttribute("onclick","tst()")
    }
    </script>
  </body>
</html>

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持億速云。

向AI問一下細(xì)節(jié)

js實現(xiàn)轉(zhuǎn)動骰子模型

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽