文档章节

js代码实现计时跳转

lemos
 lemos
发布于 2016/11/18 19:45
字数 388
阅读 13
收藏 0

setTimeout() 函数本身是异步的,理论上不会阻塞当前线程往下运行(这并不表示setTime() 中函数的执行不会对当前线程造成影响)。跟其并排的其他 setTimeout() 函数会异步执行,setTimeout() 中的函数会在设定好的延迟执行。

计时跳转

setTimeout(function () {
  window.location.href = "/";
},3000)

重复执行(内部setTimeout() 调用好几次,外部的setTimeout() 只调用一次。

setTimeout(function() {
   setTimeout(arguments.callee,interval);
  //需要3秒种执行一次的代码
},interval);

内部的 setTimeout() 获取当前执行的匿名函数,并每隔 interval时间,执行所在函数的代码块。3s -- 3s  --3s ....

定义一个匿名函数(实际上是一个函数表达式),并立即调用这个匿名函数。

(function () {
            if (interval > 0) {
                setTimeout(arguments.callee, 1000);
                $('em').text(interval);
                interval--;
            }

        })();

最后的代码是这个

 (function () {
            if (interval > 0) {
                setTimeout(arguments.callee, 1000);
                $('em').text(interval);
                interval--;
            } else {
                window.location.href = "/";
            }
        })();

或者多计时1秒

setTimeout(function () {
            if (interval > 0) {
                setTimeout(arguments.callee, 1000);
                $('em').text(interval);
                interval--;
            } else {
                window.location.href = "/";
            }
        }, 1000);

完整示例

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>无内容</title>
</head>
<body>
未找到结果, <span id="secound">3</span> 秒后跳转到首页
<script type="text/javascript">

    var sec = document.getElementById("secound")
    var interval = parseInt(sec.innerText);

    (function () {
        if (interval > 0) {
            setTimeout(arguments.callee, 1000);
            sec.innerText = interval;
            interval--;
        } else {
            window.location.href = "/";
        }
    })();
</script>

</body>
</html>

233

本文转载自:http://www.cnblogs.com/lemos/p/6077290.html

共有 人打赏支持
lemos
粉丝 8
博文 184
码字总数 92482
作品 0
芜湖
后端工程师
私信 提问
js和原生应用常用的数据交互方式

场景1 在原生app中经常会使用到H5页面,比如说电商中的活动页,一些电商中的详情页,等等...这些页面都有一个特点,那就是在未来修改的可能性,和一次性的几率特别的大。所以用H5的页面是最睿...

Jamesdanner
2018/11/13
0
0
iOS与JS交互之WKWebView-协议拦截

级别:★★☆☆☆ 标签:「iOS与JS交互」「WKWebView与JS交互」「WKWebView拦截协议」 作者: Xs·H 审校: QiShare团队 先解释下标题:“iOS与JS交互”。iOS指原生代码(文章只有示例),J...

QiShare
2018/09/01
0
0
ASP.NET(C#)实现页面计时(定时)自动跳转

ASP.NET实现页面自动跳转(经测试,在VS2008 C#环境下可通过) <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 欢迎您,本页将在秒后自......

长平狐
2013/01/06
1K
0
jquery mobile 页面跳转方法

如果使用JavaScript代码切换当前显示的页面,可以调用jQuery Mobile中的changePage()方法。该方法可以设置跳转页面的URL地址、跳转时的动画效果和需要携带的数据,接下来通过一个简单的实例详...

李佳顺
2013/05/22
0
3
页面定时跳转(倒计时跳转)代码总结

(1)使用setTimeout函数实现定时跳转(如下代码要写在body区域内) 1 <script type="text/javascript"> 2 //3秒钟之后跳转到指定的页面 3 setTimeout(window.location.href='www.baidu.com......

coat
2013/07/24
0
0

没有更多内容

加载失败,请刷新页面

加载更多

搜索引擎(Lucene-索引详解)

IndexWriter详解 问题1:索引创建过程完成什么事? 回顾架构图 Lucene索引创建API 图示 Lucene索引创建代码示例 public static void main(String[] args) throws IOException { // 创建...

这很耳东先生
12分钟前
1
0
JavaScript数据结构之栈实例用法

在本篇文章里小编给大家分享了关于JavaScript数据结构之栈实例用法内容,写的十分的全面细致,具有一定的参考价值,对此有需要的朋友可以参考学习下。如有不足之处,欢迎批评指正。 栈 先来看...

前端攻城老湿
22分钟前
1
0
springboot 使用 redis 管理session

1.pom.xml 引入依赖: <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-redis</artifactId> </dependency><dependency> ......

狼王黄师傅
23分钟前
1
0
Js取小数点后两位四种方法

在本篇文章里小编给大家分享了关于js取小数点后两位四种方法和实例代码,写的十分的全面细致,具有一定的参考价值,对此有需要的朋友可以参考学习下。如有不足之处,欢迎批评指正。 Javascri...

前端攻城小牛
29分钟前
1
0
js 唤端

h5页面唤起app const appDownload = () => { // 分享- 唤起 - 下载function failed() {window.location = '应用商店的scheme '}function transfer(cb) {window.location.href =......

何祯粮
29分钟前
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部