`
dangjun625
  • 浏览: 41674 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

一些页面自动跳转的实现

    博客分类:
  • Html
阅读更多
一些页面自动跳转的实现
功能:5秒后,自动跳转到同目录下的02view.html文件

1)html的实现
<head>
<meta http-equiv="refresh" content="5;url=02view.html">
</head>
优点:简单
缺点:Struts Tiles中无法使用

2)javascript的实现
<script language="javascript" type="text/javascript">
   setTimeout("javascript:location.href='02view.html'", 5000);
</script>
优点:灵活,可以结合更多的其他功能
缺点:受到不同浏览器的影响

3)结合了倒数的javascript实现(IE)
<span id="totalSecond">5</span>

<script language="javascript" type="text/javascript">
var second = totalSecond.innerText;
setInterval("redirect()", 1000);
function redirect(){
totalSecond.innerText=--second;
if(second<0) location.href='02view.html';
}
</script>
优点:更人性化
缺点:firefox不支持(firefox不支持span、div等的innerText属性)

3')结合了倒数的javascript实现(firefox)
<script language="javascript" type="text/javascript">
    var second = document.getElementById('totalSecond').textContent;
    setInterval("redirect()", 1000);
    function redirect()
    {
        document.getElementById('totalSecond').textContent = --second;
        if (second < 0) location.href = '02view.html';
    }
</script>

4)解决Firefox不支持innerText的问题
<span id="totalSecond">5</span>

<script language="javascript" type="text/javascript">
if(navigator.appName.indexOf("Explorer") > -1){
    document.getElementById('totalSecond').innerText = "my text innerText";
} else{
    document.getElementById('totalSecond').textContent = "my text textContent";
}
</script>

5)整合3)和3')
<span id="totalSecond">5</span>

<script language="javascript" type="text/javascript">
    var second = document.getElementById('totalSecond').textContent;

    if (navigator.appName.indexOf("Explorer") > -1)
    {
        second = document.getElementById('totalSecond').innerText;
    } else
    {
        second = document.getElementById('totalSecond').textContent;
    }


    setInterval("redirect()", 1000);
    function redirect()
    {
        if (second < 0)
        {
            location.href = '02view.html';
        } else
        {
            if (navigator.appName.indexOf("Explorer") > -1)
            {
                document.getElementById('totalSecond').innerText = second--;
            } else
            {
                document.getElementById('totalSecond').textContent = second--;
            }
        }
    }
</script>

分享到:
评论

相关推荐

    网站页面自动跳转实现方法

    网站页面自动跳转是网页开发中的常见功能,用于在用户打开一个页面后,经过一段时间或者特定条件触发,自动转向另一个页面。这种技术在各种场景下都有应用,比如页面更新、错误处理、重定向等。本篇文章将深入探讨...

    网页自动跳转功能几秒后自动跳转

    在探讨“网页自动跳转功能几秒后自动跳转”的技术实现时,我们主要关注的是网页设计中的自动重定向机制,这一机制广泛应用于各种场景,包括但不限于用户登录后的默认页面跳转、错误页面的友好性处理、以及某些特定...

    java页面自动跳转

    通过本文介绍的方法,开发者可以根据不同的场景和需求选择合适的实现方案来实现页面的自动跳转。无论是在客户端还是服务器端,都有多种可行的技术方案可供选择。希望本文能为正在从事Java Web开发的读者提供帮助和...

    三秒后自动跳转页面

    在网页设计和开发中,"三秒后自动跳转页面"是一种常见的技术手段,用于在特定条件下引导用户从当前页面转移到另一个页面。这种技术在多种场景下被广泛使用,例如错误处理、信息提示或者更新页面内容。下面我们将深入...

    10秒后页面自动跳转

    在网页开发中,有时我们需要实现一个功能,即在一定时间后自动将用户重定向到另一个页面,这通常被称为页面自动跳转。这个功能在很多场景下都有应用,比如临时维护通知、登录验证失败后的提示、或者是成功操作后的...

    漂亮的404自动跳转页面,网页错误自动跳转

    HTML meta标签也可以用来实现404页面的自动跳转。在404错误页面的HTML代码中,可以添加一个`; URL"&gt;`标签,其中`seconds`是延迟时间,`URL`是用户将被重定向到的地址。但这种方法可能不适用于所有浏览器,且用户体验...

    如何实现网页自动跳转

    ### 如何实现网页自动跳转 #### 一、概述 网页自动跳转是网站开发中的一个常见需求,它可以通过不同的技术实现。本文将详细介绍两种主要的网页自动跳转方法:使用ASP(Active Server Pages)进行服务器端跳转以及...

    javascript实现页面5秒后自动跳转到首页或其他页面

    在JavaScript中,自动跳转页面是一项常见的功能,尤其在网页设计和开发中。这个功能可以用于用户操作后的页面重定向,比如登录成功后的跳转,或者像标题中所述的5秒后自动返回首页。下面我们将深入探讨如何用...

    php页面自动跳转的几种实现方法

    除了上述两种方法外,还可以利用客户端脚本来实现页面的自动跳转。JavaScript 是一种强大的客户端脚本语言,能够轻松地控制页面的行为。通过设置 `window.location.href` 的值,可以立即或者在指定时间后跳转到另一...

    JavaScript实现x秒后自动跳转到一个页面

    在Web开发中,实现页面自动跳转是一个常见的需求,比如在用户完成某个操作后,如提交表单或确认购买,页面会自动转向一个新的URL。这里我们将详细探讨三种通过JavaScript实现x秒后自动跳转到一个页面的方法。 1. **...

    js实现网页自动跳转

    js实现网页自动跳转倒计时!html新手必备!html新手必备!html新手必备!html新手必备!

    自动刷新页面+自动跳转和关闭

    ### 自动刷新页面与自动跳转关闭的知识点详解 #### 一、自动刷新页面 **自动刷新页面**是指网页在设定的时间间隔后自动重新加载自身的过程。这一功能可以通过多种技术实现,包括HTML元标签(`&lt;meta&gt;`标签)、...

    404页面自动跳转代码.zip

    用户可以将这些代码部署到自己的服务器上,以实现自定义的404错误页面自动跳转。 通过理解和应用这些知识点,您可以创建一个既实用又具有良好用户体验的404错误页面,有效降低用户流失率,提升网站的整体质量。

    j2ee练习8实现页面自动跳转

    本项目“j2ee练习8实现页面自动跳转”旨在解决一个购物界面的跳转问题,最初存在功能无法实现的问题,但经过修正后,已经成功实现了这一目标。以下将详细介绍该知识点及其相关技术。 1. **请求转发与重定向** - **...

    网页自动跳转代码html有进度条

    网页自动跳转是一种常见的网页交互方式,特别是在页面更新、重定向到其他页面或者加载新内容时。在HTML中实现这样的功能,我们可以利用JavaScript语言来辅助完成,并且通过添加进度条来提升用户体验,让用户知道页面...

    Javaweb 登录页面自动跳转

    在JavaWeb开发中,登录页面自动跳转是一个常见的功能需求,它涉及到用户认证、会话管理以及URL重定向等核心概念。以下是对这个主题的详细解释: 1. **用户认证**:用户认证是验证用户身份的过程,通常在登录页面...

    asp.net登陆自动跳转代码实例

    在ASP.NET中,实现用户登录并自动跳转到特定页面是常见的需求,这通常涉及到身份验证(Authentication)和授权(Authorization)过程。下面我们将深入探讨这个主题。 一、身份验证基础 在ASP.NET中,身份验证主要...

    页面加载完成,js实现自动跳转

    js实现自动跳转,大家多下哈, 资源难得,几秒种跳转只需要修改后面的参数就行了!

    C#中所有页面跳转方式

    在C#与ASP.NET开发中,页面跳转是一项基本而重要的功能,它能够帮助开发者实现应用内的导航逻辑。本文将详细介绍C#中的几种页面跳转方法,并针对每种方法的特点进行分析,以便开发者可以根据具体的应用场景选择最...

Global site tag (gtag.js) - Google Analytics