老师,您好。jquery的ajax如何实现页面跳转?例如:登陆页面属于用户名和密码后,点击登陆,验证用户名和密码,正确后,跳转到其他页面。能否给个例子。

下面列了五个例子来详细说明,这几个例子的主要功能是:在5秒后,自动跳转到同目录下的hello.html(根据自己需要自行修改)文件。
1) html的实现

 

123456

优点:简单
缺点:Struts Tiles中无法使用

2) javascript的实现

123456 // 以下方式直接跳转window.location.href='hello.html';// 以下方式定时跳转setTimeout("javascript:location.href='hello.html'", 5000);

优点:灵活,可以结合更多的其他功能
缺点:受到不同浏览器的影响
3) 结合了倒数的javascript实现(IE)

1234567895 var second = totalSecond.innerText; setInterval("redirect()", 1000); function redirect(){ totalSecond.innerText=--second; if(second<0) location.href='hello.html'; }

优点:更人性化
缺点:firefox不支持(firefox不支持span、div等的innerText属性)
3') 结合了倒数的javascript实现(firefox)

123456789 var second = document.getElementById('totalSecond').textContent; setInterval("redirect()", 1000); function redirect() { document.getElementById('totalSecond').textContent = --second; if (second < 0) location.href = 'hello.html'; }

4) 解决Firefox不支持innerText的问题

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

5) 整合3)和3')

1234567891011121314151617181920212223245  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 = 'hello.html'; } else {     if (navigator.appName.indexOf("Explorer") > -1) {         document.getElementById('totalSecond').innerText = second--;     } else {         document.getElementById('totalSecond').textContent = second--;     } } }

ajax 如何实现页面跳转的更多相关文章

  1. ajax 提交成功页面跳转问题

    jsx/ajax提交成功后采用以下方式跳转:1.本页面跳转:"window.location.href"."location.href" 2.上一层页面跳转:& ...

  2. Http请求状态码302,已得到html页面但未跳转?HttpServletRequest转发/HttpServletResponse重定向后,前端页面未跳转?Ajax怎么处理页面跳转?

    论断 出现此类错误,服务器端出现问题的可能性不大,大概率是前端问题. 问题概述 事情是这样的,我在用Java开发后端.前端页面使用jQuery库的 $.getJSON() 方法发送了一个Ajax请求. ...

  3. jQuery Mobile学习之grid、等待显示的ajax效果、页面跳转、页面跳转传递参数等(二)

    Index.cshtml <!-- Start of second page --> <section data-role="page" id="bar ...

  4. .net mvc 用jquery ajax成功后页面跳转。

    $.ajax({ //url: 'http://192.168.0.102/webApiDemo/api/WebApiTest/PostStudentInforOnePara', //url: &qu ...

  5. Ajax发送POST请求SpringMVC页面跳转失败

    问题描述:因为使用的是SpringMVC框架,所以想使用ModelAndView进行页面跳转.思路是发送POST请求,然后controller层中直接返回相应ModelAndView,但是这种方法不可 ...

  6. 通过配置http拦截器,来进行ajax请求验证用户登录的页面跳转

    在.NET中验证用户是否登录或者是否过期,若需要登录时则将请求转向至登录页面. 这个流程在进行页面请求时是没问题的,能正确进行页面跳转. 然而在使用xmlhttprequest时,或者jq的getJs ...

  7. Ajax 提交session实效跳转到完整的登陆页面

    在spring security 中 Ajax提交时,session超时,局部加载登陆页面,为解决这个问题,重写ajax提交,返回的是modeview或者没有制定datatype时; 如果检测到加载到 ...

  8. 爱上MVC~ajax调用分部视图session超时页面跳转问题

    回到目录 这个问题出现了很多年了,都没有解决,问题是这样的,有一个需要授权才可以访问的分部视图,在一个view中使用ajax的方法去调用它,然后更新页面的局部DIV,这时,如果你长时间不操作,sess ...

  9. js页面用定时任务通过AJAX获取后台数据,但是从这个页面跳转到其他页面后,定时任务仍然在定时请求后台

    setInterval(function(){//ajax 请求后台数据},1000);这个是A页面的定时器然后我在A页面通过其他请求跳转到其他页面之后后台发现A页面的定时器的那个请求仍然在执行为什么 ...

随机推荐

  1. Amazon后台模拟登陆

    本文基于python3.4的selenium库打开浏览器,并将浏览器中的登陆cookie保存到本地,那么下次登陆就可以直接利用cookie了: # !/usr/bin/python3.4 # -*- ...

  2. [转]js中获取时间的函数集

    $(function(){ var mydate = new Date(); var t=mydate.toLocaleString(); $("#time").text(t); ...

  3. SQL中 EXCEPT、INTERSECT用法

    EXCEPT 返回两个结果集的差(即从左查询中返回右查询没有找到的所有非重复值). INTERSECT 返回 两个结果集的交集(即两个查询都返回的所有非重复值). UNION返回两个结果集的并集. 语 ...

  4. web首页设置如下代码可判断用户是用什么设备登录的?

    var OnePage=true;//用来判断staticHtml.js中首页登入的信息判断var _mobileUrl = "http://a.abc.com";//手机用户通过 ...

  5. eclipse新建web项目,运行后在tomcat安装目录下webapps中没有该项目

    一.发现问题在eclipse中新建Dynamic Web Project,配置好本地的tomcat并写好代码后选择Run on Server,但运行后发现在tomcat的安装目录下的webapps并没 ...

  6. discuz!3 二次开发C#学者

    PHP入门,从搞数据库开始: 大致看了以下PHP还是很简单的 比如链接数据库,就这么几行,比asp.net简单的多,就是需要自己搞数据的显示,需要精通HTML和代码生成技术: <?php $co ...

  7. VS2013 启动时遇到空白窗口

    安装了VS2013 ,然后打开,遇到空白窗口,等了10几秒无果. 我先是修复了VS2013,然后再打开VS2013,则显示登录微软账号的窗口.修复完2013时正好18:08,可能是下班了可以上网,才正 ...

  8. Maven仓库—Nexus环境搭建及简单介绍

    1.    环境搭建 1.1  下载 http://www.sonatype.org/nexus/ NEXUS OSS [OSS = Open Source Software,开源软件--免费] NE ...

  9. bzoj3743 Kamp

    Description 一颗树n个点,n-1条边,经过每条边都要花费一定的时间,任意两个点都是联通的. 有K个人(分布在K个不同的点)要集中到一个点举行聚会. 聚会结束后需要一辆车从举行聚会的这点出发 ...

  10. .net下连接数据库

    可以新建一个按钮,在click事件下,写入一下代码 using( SqlConnection conn=new SqlConnection(Data source=.; Catalog Initial ...