JS可以实现很多java代码不易完成的功能。这里学习一些js中的计时器事件。

JavaScript 一个设定的时间间隔之后来执行代码,称之为计时事件。

主要通过两个方法来实现:

1.setInterval() - 间隔指定的毫秒数不停地执行指定的代码。

2.setTimeout() - 暂停指定的毫秒数后执行指定的代码

并且,这两个方法都是window对象的方法。

首先,介绍setInterval()方法,该方法值得是间隔一定的毫秒数不停的执行指定的代码。

语法:window.setInterval(”js代码,函数等“,毫秒数);

实例1:每三秒弹出一个hello

setInterval(function(){alert("Hello")},3000);

实例2:显示当前时间,通过按钮实现时间的停止,开始

<script type="text/javascript">
var myVar;
function startTimer(){
/*setInterval() 间隔指定的毫秒数不停地执行指定的代码*/
myVar=setInterval(function(){myTimer()},1000);
}
function myTimer()/* 定义一个得到本地时间的函数*/
{
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById("demo").innerHTML=t;
}
function stopTimer()
{/* clearInterval() 方法用于停止 setInterval() 方法执行的函数代码*/
clearInterval(myVar);
}
</script>
setTimeout() 方法

在html或jsp中

<body>
<h4 id="demo"></h4>
<input type="button" onclick="startTimer()" value="开始">
<input type="button" onclick="stopTimer()" value="停止">
</body>

对于setTimeout()方法,指的是指定的毫秒数后执行指定的代码或方法。

语法:window.setTimeout("javascript 函数",毫秒数);

实例1:3秒钟后弹出”hello“提示框

setTimeout(function(){alert("Hello")},3000);

实例2:三秒钟后跳转到前一个页面

<script type="text/javascript">
setTimeout(function(){
window.history.back();
},3000);
</script>

如何执行停止呢?

clearTimeout() 方法用于停止执行setTimeout()方法的函数代码。这里注意myVar必须是一个全局变量。实例如下:

var myVar;
function myFunction()
{
myVar=setTimeout(function(){alert("Hello")},3000);
} function myStopFunction()
{
clearTimeout(myVar);
}

以上就把js计时器的基本功能简要介绍了,具体的使用场景,想要深刻理解,只有到项目用到时方可有新的理会。

JS中的计时器事件的更多相关文章

  1. js中的计时器事件`setTimeout()` 和 `setInterval()`

    js中的计时器事件 在js中,通常会有一些事件,我们需要让它 间隔一段时间之后再发生,或者 每隔一段时间 发生一次,那就需要用到我们js中的计时事件 计时事件主要有两种: setTimeout() - ...

  2. js中鼠标滚轮事件详解

    js中鼠标滚轮事件详解   (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...

  3. js中的计时器

    在JS中做二级菜单时,被一个鼠标移出时隐藏的小问题困扰了很久. <script> function Menu(id){ var _this=this; this.obj=document. ...

  4. 在js中绑定onclick事件为什么不加括号,在html代码中必须要加?

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 问题解决:在js中绑定onclick事件为什么不加括号,在html代码中必须要加?(转载)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. JS 中的自定义事件和模拟事件

    在 JS 中模拟事件指的是模拟 JS 中定义的一些事件,例如点击事件,键盘事件等. 自定义事件指的是创建一个自定义的,JS 中之前没有的事件. 接下来分别说一下创建这两种事件的方法. 创建自定义事件 ...

  7. js中获取键盘事件【转】

    <script type="text/javascript" language=JavaScript charset="UTF-8"> 2 docu ...

  8. js中获取键盘事件

    <script type="text/javascript" language=JavaScript charset="UTF-8"> docume ...

  9. onscroll事件没有响应的原因以及vue.js中添加onscroll事件监听的方法

    1 onscroll事件失效 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

随机推荐

  1. swift -2018 - 创建PCH文件

    第一种:简单方式 在swift文件 创建一个OC文件 1> command + n 2> 3> 此时 你会发现有提示 让你创建桥接文件 4>删除 OC文件 5> 直接复制 ...

  2. 32-java 里面list的问题

    申明一个对象时,一般前的类型需要申明的: List list1 = new ArrayList<Edge1>();    这个不能调用对象的属性 和 List<Edge1> l ...

  3. YII2中日志的配置与使用

    YII2中给我们提供了非常方便的日志组件,只需要简单配置一下就可以使用. 我们在config/web.php中配置如下: return [ //log必须在bootstrap期间就被加载,便于及时调度 ...

  4. Django——模板语言相关内容

    Django模板语言相关内容   Django模板系统 官方文档 常用语法 只需要记两种特殊符号: {{  }}和 {% %} 变量相关的用{{}},逻辑相关的用{%%}. 变量 {{ 变量名 }} ...

  5. python 虚拟环境操作 virtualenv +virtualenvwrapper

    Window 下创建python的虚拟环境 下载工具 pip install virtualenv 创建虚拟环境目录 # 注意此命令创建的虚拟环境目录是在当前目录下 virtualenv testen ...

  6. 安装mysql时启动服务出错问题

    mysql安装最后一步 无法启动服务错误 博客分类: IDE问题解析     今天安装mysql程序时候,在安装到最后一步时候,在最后一步却发现无法启动服务,出现这样的提示“cannot create ...

  7. Python编程笔记(第三篇)【补充】三元运算、文件处理、检测文件编码、递归、斐波那契数列、名称空间、作用域、生成器

    一.三元运算 三元运算又称三目运算,是对简单的条件语句的简写,如: 简单条件处理: if 条件成立: val = 1 else: val = 2 改成三元运算 val = 1 if 条件成立 else ...

  8. npm run build出问题十分通用的解决方法

    1.C:\NanoFabric\52ABP\SPAHost\ClientApp\node_modules 原来的目录重命名为C:\NanoFabric\52ABP\SPAHost\ClientApp\ ...

  9. Permutation Sequence LT60

    The set [1,2,3,...,n] contains a total of n! unique permutations. By listing and labeling all of the ...

  10. linux 虚拟机设置

    1.可以用网桥方式 2.可以用一个回环虚拟网卡即可.