ajax回调中的this.href不执行跳转的解决办法
1. 问题背景
如下所示代码:
$.post("/ems/register",indata, function(data){
if(data != null && data.result == 'error'){
$("#no_error").text(data.msg);
return false;
}else{
this.href="/ems/registerSuccess";
}
},'json');
即使注册成功, data.result != 'error' ,代码 : this.href="/ems/registerSuccess"; 也不会执行。测试了很久,最后才怀疑到ajax异步上来。
原因就是这里是异步调用,this.href 是处在异步调用的回调中。
但是即使是我们使用了ajax的同步调用,那么在回调函数中的:this.href="/ems/registerSuccess"; 也不会执行:
$.ajax({
url:"/ems/register",
async:false, // 注意此处需要同步,不然后面的 this.href=xxx 不执行
type:"POST",
dataType:"json",
data:indata,
success:function(data) {
if(data != null && data.result == 'error'){
alert(222);
$("#no_error").text(data.msg);
return false;
}else{
// 这里的this.href不会执行
this.href="/ems/registerSuccess";
}
}
});
即使我们 async:false 采用同步调用,在firefox浏览器中的,回调函数中的 this.href="/ems/registerSuccess"; 也不会执行。
2. 解决方法一
只有采用同步的同时,在 ajax 代码后面的 this.href="/ems/registerSuccess"; 才会执行。
$.ajax({
url:"/ems/register",
async:false, // 注意此处需要同步,不然后面的 this.href=xxx 不执行
type:"POST",
dataType:"json",
data:indata,
success:function(data) {
if(data != null && data.result == 'error'){
alert(222);
$("#no_error").text(data.msg);
return false;
}else{
// 这里的this.href不会执行
//this.href="/ems/registerSuccess";
}
}
});
this.href="/ems/registerSuccess";
最后面的 this.href="/ems/registerSuccess"; 在ajax 同步调用的后面,才会执行。
3. 解决方法二
既然我们不能使用 this.href, 那么我们可以换一种方式,我们使用 window.open(url,'_self'),经过测试,不存在this.href的问题。代码如下:
$.post("/ems/register",indata, function(data){
if(data != null && data.result == 'error'){
$("#no_error").text(data.msg);
return false;
}else{
//this.href="/ems/registerSuccess";
window.open("/ems/registerSuccess", '_self');
}
},'json');
这也算是 window.href 和 window.open(url,'_self')的一个小区别吧。
4. 解决方法三
我们在服务端 重定向,不在浏览器端重定向。就可以绕开这个问题。(其实服务端 重定向也是不行的,因为是一个 ajax 的请求,所以服务端的重定向不起任何作用,它不会让页面重定向到新的页面。)
ajax回调中的this.href不执行跳转的解决办法的更多相关文章
- 关于Spring中,定时任务执行两次的解决办法
原因:如果spring-quartz.xml文件,在Spring的配置文件spring-config.xml中被加载,那么定时任务会被Spring和SpringMVC扫描两次,所以会被执行两次. 解决 ...
- es6 Object.assign ECMAScript 6 笔记(六) ECMAScript 6 笔记(一) react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式
es6 Object.assign 目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...
- (转载)js(jquery)的on绑定点击事件执行两次的解决办法
js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...
- Android中View类OnClickListener和DialogInterface类OnClickListener冲突解决办法
Android中View类OnClickListener和DialogInterface类OnClickListener冲突解决办法 如下面所示,同时导入这两个,会提示其中一个与另一个产生冲突. 1i ...
- .NET在IE9中页面间URL传递中文变成乱码的解决办法
在.Net的项目中,鼠标点击查询按钮,转到查询页面,但URL中包含中文时,传到服务器端后,中文变成了乱码(只有IE9出现该问题). 尝试使用Server.UrlEncode()进行编码, ...
- Visual studio 2017中 Javascript对于Xrm对象模型没有智能提示的解决办法
Visual studio 2017中 Javascript对于Xrm对象模型没有智能提示的解决办法 先上个图.语法提示支持到 Microsoft Dynamics xRM API 8.2 也就是cr ...
- electron-vue中使用iview 报错this. is readonly的解决办法
title: electron-vue中使用iview 报错this. is readonly的解决办法 toc: false date: 2019-02-12 19:33:28 categories ...
- Eclipse中js文件修改后浏览器不能及时更新的解决办法
项目中js文件修改后浏览器不能及时更新的解决办法 转载:http://www.codeweblog.com/%E9%A1%B9%E7%9B%AE%E4%B8%ADjs%E6%96%87%E4%BB%B ...
- (tamcat控制台乱码)在idea中运行toncat后控制台出现乱码的情况解决办法(教程附图)。
详细教程: (tamcat控制台乱码)在idea中运行toncat后控制台出现乱码的情况解决办法(教程附图)._IT打工酱的博客-CSDN博客
随机推荐
- redis在centOS的安装
1.安装tcl支持 yum install tcl 2.安装redis我们以最新的2.8.9为例 $ wget http://download.redis.io/releases/redis-2.8. ...
- 译:什么是ViewData的, ViewBag和TempData? - MVC为当前和后续请求之间传递数据的三种方法
译文出处:http://www.codeproject.com/Articles/476967/WhatplusisplusViewData-cplusViewBagplusandplusTem AS ...
- Identity标识列
SQL Server中,经常会用到Identity标识列,这种自增长的字段操作起来的确是比较方便.但它有时还会带来一些麻烦. 示例一 :当表中被删除了某些数据的时候,自增长列的编号就不再是一个连线的数 ...
- VB 2015 的 闭包(Closure)
是的,你没看错,这篇文章讲的不是 ECMAScript . 目前 VB 14 比 C# 6 领先的功能里面,有个即将在 C# 7 实现的功能,叫做"本地方法".这个功能与" ...
- 南昌PHP程序员的工资水平据说可达到8000了
有兄弟说南昌PHP程序工资水平可以达到8k,带团队可以达到10k 好消息啊!
- Hibernate框架的总结
hibernate 简介:hibernate是一个开源框架,它是对象关联关系映射的框架,它对JDBC做了轻量级的封装,而我们java程序员可以使用面向对象的思想来操纵数据库.hibernate核心接口 ...
- 快速理解JS的闭包
/**闭包:1.在函数内部改变变量值,不影响函数外全局变量(相当于JAVA中私有变量)* 2.调用闭包后,最后产生的变量值并不释放.* 3.任何人调用闭包,闭包里面的值并不 ...
- Bootstrap 我的学习记录4 轮播图的使用和理解
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...
- owl-carousel轮播插件的使用
插件github地址:https://github.com/OwlFonk/OwlCarousel: 插件官网演示地址:http://owlgraphic.com/owlcarousel/: 1.选择 ...
- HTML中图片热区的使用
在HTML中有一个具有把图片划分成多个作用区域,并链接到不同网页的标记,那就是 <area>地图作用区域标记. <area>标记主要用于图像地图,通过该标记可以在图像地图中设定 ...