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 相关文章推荐
url地址自动加#号问题说明
Aug 21 Javascript
jQuery中使用Ajax获取JSON格式数据示例代码
Nov 26 Javascript
JS图像无缝滚动脚本非常好用
Feb 10 Javascript
jQuery+PHP打造滑动开关效果
Dec 16 Javascript
jQuery中removeClass()方法用法实例
Jan 05 Javascript
AngularJs  Understanding Angular Templates
Sep 02 Javascript
Ionic 2 实现列表滑动删除按钮的方法
Jan 22 Javascript
Vue 2.5.2下axios + express 本地请求404的解决方法
Feb 21 Javascript
详解Vue2.0组件的继承与扩展
Nov 23 Javascript
vue的列表交错过渡实现代码示例
May 05 Javascript
vue中的mescroll搜索运用及各种填坑处理
Oct 30 Javascript
vue+flask实现视频合成功能(拖拽上传)
Mar 04 Vue.js
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计算一年多少个星期和每周的开始和结束日期
2014/07/01 PHP
在Nginx上部署ThinkPHP项目教程
2015/02/02 PHP
php curl中gzip的压缩性能测试实例分析
2016/11/08 PHP
Laravel 的数据库迁移的方法
2017/07/31 PHP
详解PHP中mb_strpos的使用
2018/02/04 PHP
php递归函数怎么用才有效
2018/02/24 PHP
JS实现div内部的文字或图片自动循环滚动代码
2013/04/19 Javascript
JavaScript 对任意元素,自定义右键菜单的实现方法
2013/05/08 Javascript
基于Jquery代码实现手风琴菜单
2015/11/19 Javascript
基于jQuery实现选取月份插件附源码下载
2015/12/28 Javascript
原生JS实现旋转木马式图片轮播插件
2016/04/25 Javascript
jQuery Validate验证框架详解(推荐)
2016/12/17 Javascript
基于bootstrap实现bootstrap中文网巨幕效果
2017/05/02 Javascript
原生JavaScript实现的简单省市县三级联动功能示例
2017/05/27 Javascript
angularjs+bootstrap实现自定义分页的实例代码
2017/06/19 Javascript
原生js实现仿window10系统日历效果的实例
2017/10/31 Javascript
jQuery实现侧边栏隐藏与显示的方法详解
2018/12/22 jQuery
详解javascript对数组和json数组的操作
2019/04/15 Javascript
JavaScript实现PC端四格密码输入框功能
2020/02/19 Javascript
vue如何搭建多页面多系统应用
2020/06/17 Javascript
vue v-model的用法解析
2020/10/19 Javascript
vue vant中picker组件的使用
2020/11/03 Javascript
[08:56]DOTA2-DPC中国联赛2月23日Recap集锦
2021/03/11 DOTA
Django 项目通过加载不同env文件来区分不同环境
2020/02/17 Python
Python模拟FTP文件服务器的操作方法
2020/02/18 Python
Python基于xlutils修改表格内容过程解析
2020/07/28 Python
套娃式文件夹如何通过Python批量处理
2020/08/23 Python
日本网路线上商品代购服务:转送JAPAN
2016/08/05 全球购物
面向游戏玩家和书呆子的极客订阅盒:Loot Crate
2020/11/25 全球购物
如何写出高性能的JSP和Servlet
2013/01/22 面试题
中介业务员岗位职责
2014/04/09 职场文书
2015年大学生社会实践评语
2015/03/26 职场文书
奖励通知
2015/04/22 职场文书
小学一年级语文教学反思
2016/03/03 职场文书
Python中常见的导入方式总结
2021/05/06 Python
基于Redis实现分布式锁的方法(lua脚本版)
2021/05/12 Redis