1~36個(gè)數(shù)取7個(gè)不同的,需要用while循環(huán)+隨機(jī)數(shù)去取出7個(gè)數(shù)。
為平鄉(xiāng)等地區(qū)用戶提供了全套網(wǎng)頁設(shè)計(jì)制作服務(wù),及平鄉(xiāng)網(wǎng)站建設(shè)行業(yè)解決方案。主營業(yè)務(wù)為網(wǎng)站設(shè)計(jì)、成都網(wǎng)站建設(shè)、平鄉(xiāng)網(wǎng)站設(shè)計(jì),以傳統(tǒng)方式定制建設(shè)網(wǎng)站,并提供域名空間備案等一條龍服務(wù),秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務(wù)。我們深信只要達(dá)到每一位用戶的要求,就會得到認(rèn)可,從而選擇與我們長期合作。這樣,我們也可以走得更遠(yuǎn)!
在while循環(huán)里面,可以判斷取出來的數(shù)(用switch),是否是28,18,8. 如果有輸出相應(yīng)的獎項(xiàng),如果沒有,就輸出其它的。然后將這7個(gè)數(shù),打印出來就好了。
JavaScript(縮寫為JS)是一種高級的、多范式、解釋型的編程語言,是一門基于原型、函數(shù)先行的語言,它支持面向?qū)ο缶幊?、命令式編程以及函?shù)式編程。
它提供語法來操控文本、數(shù)組、日期以及正則表達(dá)式,不支持I/O(比如網(wǎng)絡(luò)、存儲和圖形等),但可以由它的宿主環(huán)境提供支持。它已經(jīng)由ECMA(歐洲計(jì)算機(jī)制造商協(xié)會)通過ECMAScript實(shí)現(xiàn)語言的標(biāo)準(zhǔn)化。它被世界上的絕大多數(shù)網(wǎng)站所使用,也被世界主流瀏覽器支持。
參考下面寫的小程序,是一個(gè)跑馬燈效果。
html
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
title抽獎/title
style
*{margin:0;padding:0;}
#box{width:400px;height:400px;border:2px #C6C solid;margin:20px auto;background:#99F;}
#boxdiv{position:absolute;width:60px;height:40px;color:#F03;font-size:20px;border:2px #F63 solid;opacity:0.4;line-height:40px;background:#F96;}
#butt{position:absolute;background:#F6C;color:#36F;font-size:16px;margin-top:200px;margin-left:150px;}
#span{width:300px;height:40px;margin-left:160px;display:block;border:2px #F63 solid;float:left;line-height:40px;}
#span i{font-style:normal;}
/style
/head
body
span id="span"離抽獎結(jié)束還有:i/ii/ii/ii/i/span
div id="box" class="box"
div一等獎/div
div style="margin-left:336px"二等獎/div
div style="margin-left:336px;margin-top:356px;"三等獎/div
div style="margin-top:356px;"安慰獎/div
button id="butt" onclick="butt()"點(diǎn)擊抽獎/button
/div
script type="text/javascript"
var opa=document.getElementById("box").getElementsByTagName("div");
var ii=document.getElementById("span").getElementsByTagName("i");
for(var i=0;iopa.length;i++){
opa[i].style.opacity=0.4;
}
//var span=document.getElementById("span").style;
var i=0,
t,tt,r,
count1=1,//限制一等獎只中一次,當(dāng)一等獎抽完后順延到二等獎
count2=3,//限制二等獎只中3次,當(dāng)二等獎抽完后順延到三等獎
count3=10,//限制等獎只中10次
prize=1,//抽獎是否結(jié)束
time=200,
curr=0;//每次抽獎完成才能再次點(diǎn)擊
var toDate = new Date(2016,7,29,19,55,0);
var dt,currDate;
function obtain(){//倒計(jì)時(shí)
currDate=new Date();
dt=Math.ceil((toDate.getTime()-currDate.getTime())/1000);!--轉(zhuǎn)換成s--
ii[0].innerHTML=parseInt(dt/(24*60*60))+'天';
ii[1].innerHTML=Math.floor(dt%(24*60*60)/(60*60))+'時(shí)';
ii[2].innerHTML=Math.floor(dt%(24*60*60)%(60*60)/60)+'分';
ii[3].innerHTML=Math.floor(dt%60)+'秒';
if(dt=0){
prize=0;
ii[0].innerHTML=0+'天';ii[1].innerHTML=0+'時(shí)';ii[2].innerHTML=0+'分';ii[3].innerHTML=0+'秒';
if(prize==0s==0){alert("抽獎已結(jié)束");clearInterval(tt);}
}
}
tt=setInterval(obtain,1000);
function butt(){
curr++;
if(count1==0count2==0count3==0){
prize=0;
}
if(curr==1prize==1){
if(i!=0){
opa[i].style.opacity=0.4;
}
i=0;
clearInterval(t);
r=parseInt(Math.random()*10000)+1;//產(chǎn)生1-10000的隨機(jī)數(shù)
//r=1;
opa[i].style.opacity=1;
t=setInterval(move,time);
}else if(curr!=1prize==1){alert("請等待本次抽獎完成再抽獎");alert("請點(diǎn)擊確定繼續(xù)");}
else if(prize==0){alert("抽獎已結(jié)束");}
}
/*function move(r){
switch(r){
case 1:
}
}*/
function move(){
opa[i].style.opacity=0.4;
if(iopa.length-1){
i++;
}else{i=0;}
opa[i].style.opacity=1;
time+=50;
console.log("r="+r+","+"time="+time);
if(r==1count10){//中一等獎
clearInterval(t);
t=setInterval(move,time);
if(time==800){
clearInterval(t);
time=200;
count1--;
curr=0;
console.log("中一等獎的次數(shù)還有:"+count1+"次");
}
}else if((r%2999==0||r==1count1==0)count20){//中二等獎
clearInterval(t);
t=setInterval(move,time);
if(time==850){
count2--;
clearInterval(t);
time=200;
curr=0;
console.log("中二等獎的次數(shù)還有:"+count2+"次");
}
}else if((r%1000==0||r%2999==0count2==0||r==1count1==0)count30){//中三等獎
clearInterval(t);
t=setInterval(move,time);
if(time==900){
time=200;
count3--;
clearInterval(t);
curr=0;
console.log("中三等獎的次數(shù)還有:"+count3+"次");
}
}else{//安慰獎
clearInterval(t);
t=setInterval(move,time);
if(time==950){
clearInterval(t);
curr=0;
time=200;
}
}
}
/script
/body
/html
本文實(shí)例為大家分享了js抽獎程序的編寫代碼,以及編寫注意事項(xiàng),感興趣的小伙伴們可以參考一下
代碼:
!DOCTYPE
html
html
lang="en"
head
meta
charset="UTF-8"
title簡單抽獎(可用鍵盤)/title
style
*{margin:0;padding:0;}
.box{width:
400px;height:
300px;margin:50px
auto;background:
red}
.title{color:
#fff;font-size:
30px;font-weight:700px;padding:
50px
0;text-align:
center;height:40px;}
.btm{text-align:
center;padding:20px
0;}
.btm
a{display:
inline-block;width:
120px;height:60px;line-height:
60px;background:
#FEF097;margin:0
10px;text-decoration:
none;}
/style
script
var
data=['Iphone','Ipad','筆記本','相機(jī)','謝謝參與','充值卡','購物券'],
timer=null,//定時(shí)器
flag=0;//阻止多次回車
window.onload=function(){
var
play=document.getElementById('play'),
stop=document.getElementById('stop');
//
開始抽獎
play.onclick=playFun;
stop.onclick=stopFun;
//
鍵盤事件
document.onkeyup=function(event){
event
=
event
||
window.event;
//
回車鍵的code值:13
if(event.keyCode==13){
if(flag==0){
playFun();
flag=1;
}else{
stopFun();
flag=0;
}
}
}
function
playFun(){
var
title=document.getElementById('title');
var
play=document.getElementById('play');
clearInterval(timer);
timer=setInterval(function(){
var
random=Math.floor(Math.random()*data.length);
title.innerHTML=data[random];
},60);
play.style.background='#999';
}
function
stopFun(){
clearInterval(timer);
var
play=document.getElementById('play');
play.style.background='#FEF097';
}
}
/script
/head
body
div
class="box"
div
class="title"
id="title"淘家趣抽獎/div
div
class="btm"
a
href="javascript:;"
id="play"開始/a
a
href="javascript:;"
id="stop"停止/a
/div
/div
/body
/html
注意點(diǎn):
1.隨機(jī)數(shù),取數(shù)組的其中一個(gè);取0-n之間:Math.random()*(n+1)
2.定時(shí)器,開始抽獎時(shí)要停止前面的一次抽獎,不然會定時(shí)器重疊
3.按鍵操作,要判斷是抽獎進(jìn)行中,還是未開始,所有設(shè)置了變量
flag
想要學(xué)習(xí)更多關(guān)于javascript抽獎功能,請參考此專題:javascript實(shí)現(xiàn)抽獎功能
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。