用js实现奸商版抽奖

最新推荐文章于 2024-07-31 13:55:09 发布

allen3jie

最新推荐文章于 2024-07-31 13:55:09 发布

阅读量150

点赞数

本文链接：https://blog.csdn.net/allen3jie/article/details/80083130

版权

这是一个使用JavaScript编写的简单抽奖程序，包含开始和结束按钮。当点击开始按钮时，图片会随机切换，模拟抽奖过程；点击结束按钮后，根据概率显示特定的中奖图片。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.οnlοad=function(){
var start=document.getElementById("start");
var end=document.getElementById("end");
var pic=document.getElementById("pic");
//用来存储图片路径的数组
var picarr =['image/03-02.jpg','image/03-03.jpg','image/03-01.jpg','image/04-01.jpg','image/04-02.jpg']
var timer;

//给开始加单击事件
start.οnclick=function(){
//设置定时器，每隔0.4秒就换一张图片
timer = setInterval(function(){
//抽取随机下标
var num= Math.floor(Math.random()*(picarr.length-1+1-0)+0);
pic.setAttribute('src',picarr[num])
},400)
}
end.οnclick=function(){
clearInterval(timer);
var num=Math.random()*5;
if (num<4){
pic.setAttribute('src','image/03-03.jpg');
}
}
}
</script>
</head>
<body>
<div id="content">
<input type="button" id="start" value="开始抽奖" />
<input type="button" id="end" value="结束抽奖" />
</div>
<br /><br />
<img src="image/03-01.jpg" id="pic"/>
</body>
</html>