首页 >

基于javascript实现简单的抽奖系统【javascript】

web前端|js教程基于javascript实现简单的抽奖系统【javascript】
javascript抽奖系统,js抽奖
web前端-js教程
本文实例为大家分享了js实现简单的抽奖系统,供大家参考,具体内容如下
php计算源码,vscode 插件设置,ubuntu GFW,ant 重启tomcat,安卓sqlite查询打印,wordpress免费电子商务插件,后端与前端交互必须用框架,地推爬虫软件有哪些,php广告管理,seo优化搜索方式,免费企业网站模板 php,答题 网页代码,三模板lzw
    抽奖活动  *{ margin:0;padding:0;}#title{ color:red;text-align:center;margin:0 auto;width:240px;height:70px;padding-top:10px;background:opacity(0);}.btns{ width:190px;height:30px;margin:0px auto;} .btns span{ display:block;float:left;width:80px;height:28px;text-align:center;background:#036;color:#fff;cursor:pointer;border:1px solid #eee;border-radius:8px;font-family:"微软雅黑";font-size:14px;line-height:28px;margin-right:10px;}#txt{ font-size:14px;color:#ccc999;text-align:center;margin:0 auto;width:190px;height:50px;padding-top:10px;}     var mytype=["iPhone6s","iPad Air2","DELL外星人","键鼠套装","1000元超市购物卡","200元话费充值卡","谢谢参与","品牌耳机","港澳台7日游","50元优惠券"],//定义奖品池   timer=null,   count=0;//加载时触发 window.onload=function(){ var start = document.getElementById("start"); var stop = document.getElementById("stop");  start.onclick=startFun;//这个函数后面加括号,就直接调用了该函数,所以不要加 stop.onclick=stopFun;  //绑定键盘事件 document.onkeyup=function(e){   e = e || window.event;  if(e.keyCode==13){    if(count==0){    startFun();    count=1;    }  else{      stopFun();    count=0;    }  } } } //点击开始,标题栏开始轮动 function startFun(){  clearInterval(timer);//开始时,清除计时器,避免二次触发  var title = document.getElementById("title");  var start = document.getElementById("start");   timer = setInterval(function(){    var num= Math.floor(Math.random()*mytype.length);    title.innerHTML=mytype[num];  },50);  start.style.background="#ccc";  } //点击停止,标题栏停止轮动并输出轮动结果 function stopFun(){  var start = document.getElementById("start"),    txt = document.getElementById("txt"),    title = document.getElementById("title");  clearInterval(timer);//清除计时器,停止计时器  start.style.background="#036"; }     

开始抽奖!

开始 停止
支持回车键(Enter)开始/停止。
效果图:
桃彩源码免费下载,t480 ubuntu,什么动物爬虫最多,php bcmath,seo优化网名lzw
android contacts 源码,ubuntu打开远程,pathon 爬虫是什么,php 传递数组给php,乐华娱乐seolzw
想要学习更多关于javascript抽奖功能,请参考此专题:javascript实现抽奖功能

实现的功能就是这么简单,希望大家可以中大奖哦!


  • 暂无相关文章