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 相关文章推荐
js 获取(接收)地址栏参数值的方法
Apr 01 Javascript
Javascript基础知识盲点总结之函数
May 15 Javascript
jQuery的each循环用法简单示例
Jun 12 Javascript
对javascript继承的理解
Oct 11 Javascript
解决给dom元素绑定click等事件无效问题的方法
Feb 17 Javascript
基于datepicker定义自己的angular时间组件的示例
Mar 14 Javascript
浅谈vue方法内的方法使用this的问题
Sep 15 Javascript
小程序跨页面交互的作用与方法详解
Jan 07 Javascript
Vue登录拦截 登录后继续跳转指定页面的操作
Aug 04 Javascript
vue内置组件keep-alive事件动态缓存实例
Oct 30 Javascript
javascript中layim之查找好友查找群组
Feb 06 Javascript
JS监听Esc 键触发事键
Apr 14 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
微信公众号支付之坑:调用支付jsapi缺少参数 timeStamp等错误解决方法
2016/01/12 PHP
MacOS下PHP7.1升级到PHP7.4.15的方法
2021/02/22 PHP
javascript 手动给表增加数据的小例子
2013/07/10 Javascript
JQuery中dataGrid设置行的高度示例代码
2014/01/03 Javascript
node.js中的fs.lstat方法使用说明
2014/12/16 Javascript
DOM基础教程之使用DOM + Css
2015/01/20 Javascript
JavaScript中模拟实现jsonp
2015/06/19 Javascript
JS实现灵巧的下拉导航效果代码
2015/08/25 Javascript
Angularjs中使用Filters详解
2016/03/11 Javascript
JavaScript每天必学之事件
2016/09/18 Javascript
node.js入门教程之querystring模块的使用方法
2017/02/27 Javascript
Django与Vue语法的冲突问题完美解决方法
2017/12/14 Javascript
Vue使用枚举类型实现HTML下拉框步骤详解
2018/02/05 Javascript
js实现数字滚动特效
2019/12/16 Javascript
JS async 函数的含义和用法实例总结
2020/04/08 Javascript
Bootstrap FileInput实现图片上传功能
2021/01/28 Javascript
Python 实现数据库(SQL)更新脚本的生成方法
2017/07/09 Python
Python实现小数转化为百分数的格式化输出方法示例
2017/09/20 Python
Python实现堡垒机模式下远程命令执行操作示例
2019/05/09 Python
python多线程同步之文件读写控制
2021/02/25 Python
基于python解线性矩阵方程(numpy中的matrix类)
2019/10/21 Python
Python中私有属性的定义方式
2020/03/05 Python
浅谈python3 构造函数和析构函数
2020/03/12 Python
可视化pytorch 模型中不同BN层的running mean曲线实例
2020/06/24 Python
Python函数调用追踪实现代码
2020/11/27 Python
HTML5基于flash实现播放RTMP协议视频的示例代码
2020/12/04 HTML / CSS
阿联酋网上花店:Ferns N Petals
2018/02/14 全球购物
美国购买体育赛事门票网站:TicketCity
2019/03/06 全球购物
教师的实习鉴定
2013/12/15 职场文书
搞笑爱情保证书
2014/04/29 职场文书
软件项目实施计划书
2014/05/02 职场文书
项目工作说明书
2014/07/29 职场文书
小学生春游活动方案
2014/08/20 职场文书
法院答辩状格式
2015/05/22 职场文书
承诺书的内容有哪些,怎么写?
2019/06/21 职场文书
分享python函数常见关键字
2022/04/26 Python