js_计时器之setInterval
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var intervalId;
window.onload = function () {
//点击这个按钮,启动中间的计时器, setInterval计时器需要传递两个参数,一个是一个函数,一个是时间
document.getElementById('btnStart').onclick = function () {
//启动一个计时器
intervalId = setInterval(function () {
document.getElementById('txt1').value++;
// //0.获取文本框对象
// var txtObj = document.getElementById('txt1');
// txtObj.value++;
// // txtObj.value = ++txtObj.value;
// // //每隔一秒钟执行一次这里的代码
// // //让文本框中的数字累加
// // //1.获取文本框中原来的值
// // var v = txtObj.value;
// // //2.加1
// // v = parseInt(v) + 1; 将字符串转换成int类型的值
// // //3.将新值再赋值给文本框
// // txtObj.value = v;
}, 1000);
};
//停止
document.getElementById('btnStop').onclick = function () {
clearInterval(intervalId);
};
};
</script>
</head>
<body>
<input type="text" name="name" value="0" id="txt1" />
<input type="button" name="name" value="start" id="btnStart" />
<input type="button" name="name" value="stop" id="btnStop" />
</body>
</html>
js_计时器之setInterval的更多相关文章
- JavaScript 计时事件-setInterval()-clearInterval() -setTimeout()-clearTimeout()
(PS:JavaScript 一个设定的时间间隔之后来执行代码,我们称之为计时事件.) JavaScript 计时事件 通过使用 JavaScript,我们有能力做到在一个设定的时间间隔之后来执行代码 ...
- JavaScript基础知识(二)
一.JavaScript事件详解 1.事件流:描述的是在页面中结束事件的顺序 事件传递有两种方式:冒泡与捕获. 事件传递定义了元素事件触发的顺序. 如果你将 <p> 元素插入到 <d ...
- 微信小程序开发小结
1.点击按钮分享功能: 使用Button组件,设置open-type="share",然后在js文件的onShareAppMessage方法中设置如下: onShareAppMes ...
- 初级JS
唐太宗 李世民 杀了大哥 和弟弟 登上的皇位 一个人当皇帝 排他性是指一种物品具有可以阻止其他人使用该物品的特性. 排他性思想: 在程序中但凡是遇到只让自己怎么样,不让别人怎么样的效果,都 ...
- HTML的DOM和浏览器的BOM
DOM和BOM的区别 HTML DOM 的 document 是 BOM 的 window 对象的属性之一: 通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML. Ja ...
- JavaScript学习笔记之BOM对象
目录 1.Window 2.Window Screen 3.Window Location 4.Window History 5.Window Navigator 浏览器对象模型(Browser Ob ...
- JavaScript操作HTML&CSS简单入门
- Java攻城狮学习路线 - 一. JavaScript基础 输出 使用 window.alert() 弹出警告框. 使用 document.write() 方法将内容写到 HTML 文档中. 使用 ...
- 03 . 前端之JavaScipt
JavaScript概述 ECMAScript和JavaScript的关系 1996年11月,JavaScript的创造者–Netscape公司,决定将JavaScript提交给国际标准化组织ECMA ...
- Bom 基本使用以及定时器 倒计时案例
BOM 是浏览器对象模型 它提供了独立内容而与浏览器窗口进行交互的对象,其核心对象是window 窗口加载事件 注意:window.onload 就可以吧JS代码写在页面元素的上方,因为onload是 ...
随机推荐
- jdbc连接oracle数据库问题
下面是JDBC连接oracle数据库流程: String dbURL = "jdbc:oracle:thin:@url:1521:service_name"; String use ...
- Spring IOC 和 AOP
一. IOC 1. 概念及原理 IOC: Inversion of Control(控制反转)是一种设计思想,就是容器控制应用程序所需要的外部资源的创建和管理,然后将其反转给应用程序.对象及其依赖对象 ...
- Oracle之用户和表空间
用户和表空间 看具体下载什么来操作?(oracle 11g,终端) 如果不在虚拟桌面, 它在整个总账项目里占什么位置? 如何使用? 不管学什么都要及时复习和总结,很重要. 增删改查 decode ...
- asyncio 学习
来自:https://www.syncd.cn/article/asyncio_article_02 一.asyncio之—-入门初探 通过上一篇关于asyncio的整体介绍,看过之后基本对async ...
- kivy 滑动
from kivy.uix.gridlayout import GridLayout from kivy.app import App from kivy.lang.builder import Bu ...
- Docker学习笔记之Docker的Build 原理
0x00 概述 使用 Docker 时,最常用的命令无非是 docker container 和 docker image 相关的子命令,当然最初没有管理类命令(或者说分组)的时候,最常使用的命令也无 ...
- 标签无效 "/zabbix_export/date": "YYYY-MM-DDThh:mm:ssZ" 预计。
Centos7.5 使用导入percona模板的时候报错 百度给的解决方案是 将zabbix_agent_template_percona_mysql_server_ht_2.0.9-sver1.1. ...
- Loader
1.定义 可以把Loader当做一个占位符,即占有屏幕的某一个空间,当加载了组件之后,这个空间就能显示相应的图形了.所以可以给Loader设置anchor布局 2.加载组件 source:加载QML文 ...
- ODAC(V9.5.15) 学习笔记(十三)TOraMetaData
通过TOraMetaData控件获取Oracle数据库对象信息,首先需要设置MetaDataKind属性,然后设置Restrictions属性设置条件,最后通过激活数据集获取信息,演示代码如下: Me ...
- vim插件的安装方式 -- vim注释插件和doxygen函数注释生成插件-ctrlp插件-tabular等号对齐 插件
使用unzip的时候 指定 -d选项, 是说明解压到的 目标地址. 这个参数还是比较方便的, 比直接unzip到当前目录, 然后在去拷贝到目标目录, 然后再删除当前目录中的解压文件夹, 方便多了. 使 ...