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模块化编程(一)模块的写法最佳实践
Jan 17 Javascript
jQuery 设置 CSS 属性示例介绍
Jan 16 Javascript
页面加载完后自动执行一个方法的js代码
Sep 06 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记9)
Dec 24 Javascript
解决jquery无法找到其他父级子集问题的方法
May 10 Javascript
深入理解jQuery中的事件冒泡
May 24 Javascript
BootStrap iCheck插件全选与获取value值的解决方法
Aug 24 Javascript
WebView启动支付宝客户端支付失败的问题小结
Jan 11 Javascript
vue数据控制视图源码解析
Mar 28 Javascript
微信小程序实现多选框全选与取消全选功能示例
May 14 Javascript
ES6中定义类和对象的方法示例
Jul 31 Javascript
antd form表单数据回显操作
Nov 02 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
PHP 的 __FILE__ 常量
2007/01/15 PHP
php获取网页内容方法总结
2008/12/04 PHP
php广告加载类用法实例
2014/09/23 PHP
PHP实现QQ快速登录的方法
2016/09/28 PHP
PHP删除数组中指定下标的元素方法
2018/02/03 PHP
PHPExcel实现表格导出功能示例【带有多个工作sheet】
2018/06/13 PHP
PHP __call()方法实现委托示例
2019/05/20 PHP
JavaScript脚本语言在网页中的简单应用
2007/05/13 Javascript
AJAX分页的代码(后台asp.net)
2011/02/14 Javascript
javascript去掉前后空格的实例
2013/11/07 Javascript
Javascript基础教程之比较操作符
2015/01/18 Javascript
AngularJS语法详解(续)
2015/01/23 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
2015/03/18 Javascript
使用JQuery在线制作ppt并在线演示源码特效
2015/09/08 Javascript
Clipboard.js 无需Flash的JavaScript复制粘贴库
2015/10/02 Javascript
基于JS实现导航条之调用网页助手小精灵的方法
2016/06/17 Javascript
AngularJS基础 ng-non-bindable 指令详细介绍
2016/08/02 Javascript
手把手教你把nodejs部署到linux上跑出hello world
2017/06/19 NodeJs
node thread.sleep实现示例
2018/06/20 Javascript
javascript实现留言板功能
2020/02/08 Javascript
es6中new.target的作用和使用场景简单示例分析
2020/03/14 Javascript
微信小程序实现电子签名功能
2020/07/29 Javascript
python进阶教程之函数对象(函数也是对象)
2014/08/30 Python
Python简单生成随机姓名的方法示例
2017/12/27 Python
用Python将结果保存为xlsx的方法
2019/01/28 Python
通过实例解析Python调用json模块
2019/12/11 Python
Python实现多线程下载脚本的示例代码
2020/04/03 Python
在keras 中获取张量 tensor 的维度大小实例
2020/06/10 Python
日本著名化妆品零售网站:Cosme Land
2019/03/01 全球购物
毕业生找工作推荐信
2013/11/21 职场文书
会计专业的自荐信
2013/12/12 职场文书
体育运动会广播稿
2014/10/05 职场文书
工作检讨书怎么写
2015/01/23 职场文书
保护地球的宣传语
2015/07/13 职场文书
高考要来啦!用Python爬取历年高考数据并分析
2021/06/03 Python
mysql sql常用语句大全
2022/06/21 MySQL