JS實現簡單的幸運抽獎頁面 效果圖： 圖片素材 ： 代碼如下，複製即可使用： 如果您有更好的方法或更多的功能，可以和我們大家一起分享哦，如有錯誤，歡迎聯繫我改正。非常感謝！！！ ...
JS實現簡單的幸運抽獎頁面
效果圖：
圖片素材 ：
代碼如下，複製即可使用：
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>幸運抽獎頁面</title> <style> /*CSS代碼*/ *{ padding:0; margin:0; } .login-box{ width:500px; height:430px; /* border:1px solid red;*/ /*水平居中*/ margin:100px auto;
<!-- 此處需要修改為自己的圖片路徑 -->
background: url(img/tx1.png) no-repeat; box-shadow: 0 0 2px rgba(0,0,0,.5); } .login{ padding:5px; border:0 none; background: #0a88e1; color: white; font-size:12px; text-align: center; width:220px; line-height: 20px; margin-top:200px; margin-left:120px; } </style> </head> <body> <div class="login-box"> <input type="button" value="點擊開始抽獎" class="login" id="luckbtn" onclick="luck()"/> </div> </body> <script> //JS代碼：幸運抽獎 var no = prompt("請輸入您的四位會員卡號："); //獲取到抽獎按鈕 document.getElementById("luckbtn").value =no+"-歡迎你，點擊開始抽獎" ; //當點擊抽獎按鈕的時候調用，幸運抽獎的規則及提醒，功能 function 函數 function luck(){ //系統隨機生成一個0-10之間的隨機整數 :Math.random() 0-1之間的浮點數 var num = parseInt(Math.random()*10); /*alert(num);*/ //隨機數=會員卡號的百位數 /* var gewei = no%10; alert(gewei);*/ /*var shiwei = parseInt(no/10%10); alert(shiwei);*/ var baiwei = parseInt(no/100%10); /*alert(baiwei);*/ if(baiwei == num){ alert("恭喜"+no+",您中獎了！"); }else{ alert("對不起，"+no+"，您沒有中獎！"); } } </script> </html>
如果您有更好的方法或更多的功能，可以和我們大家一起分享哦，如有錯誤，歡迎聯繫我改正。非常感謝！！！
