JavaScript-定时器0~9抽奖系统详解(代码)


Posted in Javascript onAugust 16, 2017

具体代码如下:

<html> 
 <head> 
  <title>定时器0~9抽奖系统</title> 
  <meta charset="UTF-8" /> 
  <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> 
  <script type="text/javascript"> 
   $(function(){ 
    $("#start").click(function(){ 
     fn(); 
     timer = setInterval('fn()',200);//向DIV中填充内容 
    }); 
    $("#stop").click(function(){ 
     clearInterval(timer);//清除定时器 
    }); 
   }); 
   var i=0; 
   function fn(){ 
    $("#box").html(i); 
    i++; 
    if(i==10){ 
     i=0; 
    } 
   } 
  </script> 
 </head> 
 <body> 
  <div> 
   <button id="start" type="button">开始</button> 
   <button id="stop" type="button">停止</button> 
  </div> 
  <br /> 
  <div id="box" style="width:200px;height:100px;border:1px solid;line-height:100px;font-size:80px;text-align:center;"></div> 
 </body> 
</html>

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助~如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持!

Javascript 相关文章推荐
JQuery中html()方法使用不当带来的陷阱
Apr 07 Javascript
js模拟滚动条(横向竖向)
Feb 22 Javascript
JavaScript字符串对象replace方法实例(用于字符串替换或正则替换)
Oct 16 Javascript
jQuery 中$(this).index与$.each的使用指南
Nov 20 Javascript
跟我学习javascript的最新标准ES6
Nov 20 Javascript
JQuery遍历元素的父辈和祖先的方法
Sep 18 Javascript
js实现定时进度条完成后切换图片
Jan 04 Javascript
JavaScript实现类似淘宝的购物车效果
Mar 16 Javascript
layer.open关闭父窗口 以及调用父页面的方法
Aug 17 Javascript
详解VS Code使用之Vue工程配置format代码格式化
Mar 20 Javascript
jQuery实现移动端图片上传预览组件的方法分析
May 01 jQuery
vue proxy 的优势与使用场景实现
Jun 15 Javascript
vue实现留言板todolist功能
Aug 16 #Javascript
Angularjs中的验证input输入框只能输入数字和小数点的写法(推荐)
Aug 16 #Javascript
vue的事件绑定与方法详解
Aug 16 #Javascript
vue父组件通过props如何向子组件传递方法详解
Aug 16 #Javascript
关于vue.extend和vue.component的区别浅析
Aug 16 #Javascript
在一般处理程序(ashx)中弹出js提示语
Aug 16 #Javascript
深入研究jQuery图片懒加载 lazyload.js使用方法
Aug 16 #jQuery
You might like
YII Framework框架教程之缓存用法详解
2016/03/14 PHP
最短的javascript:地址栏载入脚本代码
2011/10/13 Javascript
基于jquery的滚动鼠标放大缩小图片效果
2011/10/27 Javascript
后台获取ZTREE选中节点的方法
2015/02/12 Javascript
javascript实现获取字符串hash值
2015/05/10 Javascript
jQuery构造函数init参数分析续
2015/05/13 Javascript
js计算系统当前日期是星期几的方法
2016/07/14 Javascript
删除table表格行的实例讲解
2017/09/21 Javascript
关于JavaScript语句后面的分号问题
2017/12/07 Javascript
基于jQuery实现无缝轮播与左右点击效果
2018/05/13 jQuery
vue 导航内容设置选中状态样式的例子
2019/11/01 Javascript
Element-UI+Vue模式使用总结
2020/01/02 Javascript
jQuery实现小火箭返回顶部特效
2020/02/03 jQuery
JavaScript实现世界各地时间显示
2020/09/07 Javascript
[56:35]DOTA2上海特级锦标赛主赛事日 - 5 总决赛Liquid VS Secret第一局
2016/03/06 DOTA
[42:11]TNC vs Pain 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
深入浅析Python中join 和 split详解(推荐)
2016/06/30 Python
Python+OpenCV图片局部区域像素值处理改进版详解
2019/01/23 Python
spark dataframe 将一列展开,把该列所有值都变成新列的方法
2019/01/29 Python
在Python中append以及extend返回None的例子
2019/07/20 Python
Python调用graphviz绘制结构化图形网络示例
2019/11/22 Python
详解CSS3实现响应式手风琴效果
2020/06/10 HTML / CSS
详解H5本地储存Web Storage
2017/07/03 HTML / CSS
HTML5 audio标签使用js进行播放控制实例
2015/04/24 HTML / CSS
美国一家专业的太阳镜网上零售商:Solstice太阳镜
2016/07/25 全球购物
职高毕业生自我鉴定
2013/10/21 职场文书
大学开学计划书
2014/04/30 职场文书
企业优秀员工事迹材料
2014/05/28 职场文书
代理人委托书
2014/08/01 职场文书
个人授权委托书范文
2014/09/21 职场文书
社保代办委托书怎么写
2014/10/06 职场文书
慈善募捐倡议书
2015/04/27 职场文书
机器人瓦力观后感
2015/06/12 职场文书
岗位聘任协议书
2015/09/21 职场文书
观看《信仰》心得体会
2016/01/15 职场文书
协议书格式模板
2016/03/24 职场文书