HTML5搶紅包代碼分享如下：
<html>
<head>
<title>搶紅包</title>
<meta charset="UTF-8">
</head>
<body>
<div id="red-packet">
<p>點(diǎn)擊屏幕搶紅包</p>
</div>
<script type="text/javascript">
var num = 10; //紅包總數(shù)
var totalMoney = 100; //紅包總金額
var packetArr = new Array(); //存放紅包的數(shù)組
var timer = null; //定時(shí)器變量
//生成紅包
function createPacket() {
for(var i=0; i<num; i++) {
var money = (Math.random()*totalMoney/num).toFixed(2); //每個(gè)紅包的金額
packetArr.push(money); //將紅包金額存入數(shù)組
}
}
//顯示紅包
function showPacket() {
var packetDiv = document.getElementById("red-packet");
packetDiv.onclick = function() {
var money = packetArr.shift(); //取出一個(gè)紅包的金額
if(money != undefined) { //如果數(shù)組中還有紅包
alert("恭喜您搶到了"+money+"元！");
packetDiv.innerHTML = "點(diǎn)擊屏幕繼續(xù)搶紅包";
}else { //如果紅包已經(jīng)搶完
clearInterval(timer); //清除定時(shí)器
packetDiv.innerHTML = "紅包已經(jīng)搶完啦！";
}
}
}
//定時(shí)器控制紅包的生成和顯示
function timerControl() {
createPacket(); //生成紅包
showPacket(); //顯示紅包
timer = setInterval(function() {
packetArr.length = 0; //清空紅包數(shù)組
createPacket(); //重新生成紅包
showPacket(); //重新顯示紅包
}, 10000); //每隔10秒重新生成紅包
}
timerControl(); //開(kāi)始定時(shí)器
</script>
</body>
</html>以上就是HTML5搶紅包代碼，此代碼采用定時(shí)器控制紅包的生成和顯示，可以自定義紅包總數(shù)和總金額，是一段值得學(xué)習(xí)和使用的代碼。