30米地笼多少钱一个

書名： JavaScript前端開發(fā)程序設(shè)計(jì)教程（微課版）
作者名：李玉臣臧金梅
本章字?jǐn)?shù)： 314字
更新時(shí)間： 2019-12-20 19:37:09

1.4 【綜合案例1】：隨機(jī)抽獎(jiǎng)小程序

這個(gè)抽獎(jiǎng)主要是通過在HTML中嵌入JavaScript代碼實(shí)現(xiàn)隨機(jī)抽獎(jiǎng)，通過單擊“開始抽獎(jiǎng)”按鈕實(shí)現(xiàn)開始隨機(jī)抽獎(jiǎng)，按“停止抽獎(jiǎng)”實(shí)現(xiàn)抽獎(jiǎng)結(jié)果，顯示抽獎(jiǎng)結(jié)果。通過這個(gè)小案例，大家初步認(rèn)識(shí)一下JavaScript腳本在HTML中的應(yīng)用，其效果如圖1-12和圖1-13所示。

圖1-12 開始抽獎(jiǎng)界面

圖1-13 停止抽獎(jiǎng)界面

實(shí)現(xiàn)上述效果用以下代碼就可以了，代碼就是通過在HTML中嵌入JavaScript代碼實(shí)現(xiàn)的，可以初步感受一下JavaScript代碼。

　　　　var namelist=[

　　　　"1號(hào)球","2號(hào)球","3號(hào)球","4號(hào)球","5號(hào)球","6號(hào)球","7號(hào)球","8號(hào)球","9號(hào)球","10號(hào)球"];

　　　　var mytime=null;

　　　　function doit(){

　　　　　　var bt=window.document.get Element By Id("bt");

　　if(mytime==null){

　　　　bt.inner HTML="停止抽獎(jiǎng)";

　　　　show();

　　}else{

　　　　bt.inner HTML="開始抽獎(jiǎng)";

　　　　clear Timeout(mytime);

　　　　mytime=null;

　　}

function show(){

　　var box=window.document.get Element By Id("box");

　　var num=Math.floor((Math.random()*100000))%namelist.length;

　　box.inner HTML=namelist[num];

　　mytime=set Timeout("show()",1);

}

</script>

HTML頁面代碼如下所示。

　　<div id="box">準(zhǔn)備好了，開始抽獎(jiǎng)了</div>

　　<div id="bt" on Click="doit()">開始抽獎(jiǎng)</div>

　　<p>適用瀏覽器：IE8、360、Fire Fox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. </p>

　　</div>

</body>

官术网_书友最值得收藏!

JavaScript前端開發(fā)程序設(shè)計(jì)教程（微課版）

1.4 【綜合案例1】：隨機(jī)抽獎(jiǎng)小程序