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 相关文章推荐
Javascript中Eval函数的使用说明
Oct 11 Javascript
Javascript select控件操作大全(新增、修改、删除、选中、清空、判断存在等)
Dec 19 Javascript
JS 面向对象的5钟写法
Jul 31 Javascript
jQuery Study Notes学习笔记 (二)
Aug 04 Javascript
JavaScript中的object转换函数toString()与valueOf()介绍
Dec 31 Javascript
js实现的Easy Tabs选项卡用法实例
Sep 06 Javascript
javascript入门之window对象【新手必看】
Nov 22 Javascript
详解angular 中的自定义指令之详解API
Jun 20 Javascript
微信小程序 页面跳转事件绑定的实例详解
Sep 20 Javascript
JS中Object对象的原型概念基础
Jan 29 Javascript
jQuery中将json数据显示到页面表格的方法
May 27 jQuery
Vue使用watch监听一个对象中的属性的实现方法
May 10 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
自编函数解决pathinfo()函数处理中文问题
2014/11/03 PHP
php session的锁和并发
2016/01/22 PHP
PHP SPL 被遗落的宝石【SPL应用浅析】
2018/04/20 PHP
一页面多XMLHttpRequest对象
2007/01/22 Javascript
javascript TextArea动态显示剩余字符
2008/10/22 Javascript
40款非常有用的 jQuery 插件推荐(系列一)
2011/12/21 Javascript
jQuery中width()方法用法实例
2014/12/24 Javascript
jQuery实现数秒后自动提交form的方法
2015/03/05 Javascript
jQuery插件jcrop+Fileapi完美实现图片上传+裁剪+预览的代码分享
2015/04/22 Javascript
jQuery中(function($){})(jQuery)详解
2015/07/15 Javascript
基于canvas实现的绚丽圆圈效果完整实例
2016/01/26 Javascript
浅谈jquery的map()和each()方法
2016/06/12 Javascript
工作中比较实用的JavaScript验证和数据处理的干货(经典)
2016/08/03 Javascript
原生js 封装get ,post, delete 请求的实例
2017/08/11 Javascript
对于Javascript 执行上下文的全面了解
2017/09/05 Javascript
jQuery实现常见的隐藏与展示列表效果示例
2018/06/04 jQuery
JS立即执行的匿名函数用法分析
2019/11/04 Javascript
Vue 中 template 有且只能一个 root的原因解析(源码分析)
2020/04/11 Javascript
Python sys.path详细介绍
2013/10/17 Python
详解Python的Flask框架中的signals信号机制
2016/06/13 Python
Python基于递归算法实现的走迷宫问题
2017/08/04 Python
Python科学画图代码分享
2017/11/29 Python
OpenCV-Python实现轮廓检测实例分析
2018/01/05 Python
值得收藏,Python 开发中的高级技巧
2018/11/23 Python
Python Numpy库datetime类型的处理详解
2019/07/13 Python
Python API自动化框架总结
2019/11/12 Python
简单掌握CSS3中resize属性的用法
2016/04/01 HTML / CSS
canvas 绘图时位置偏离的问题解决
2020/09/16 HTML / CSS
澳大利亚100%丝绸多彩度假装商店:TheSwankStore
2019/09/04 全球购物
小学教师事迹材料
2014/01/13 职场文书
材料化学专业求职信
2014/07/15 职场文书
2015年食堂工作总结报告
2015/04/23 职场文书
汽车修理厂管理制度
2015/08/05 职场文书
2016年学校党支部创先争优活动总结
2016/04/05 职场文书
2019运动会广播加油稿汇总
2019/08/21 职场文书
Java Spring 控制反转(IOC)容器详解
2021/10/05 Java/Android