一、Form提交,打开新页面被拦截

手动触发Form提交打开新页面是不会被拦截的,但是如果通过Ajax异步处理回调后再程序自动触发Form提交的话,就会被浏览器当成广告弹框拦截

1、暂时的解决办法:如果必须要在Ajax异步回调之后程序自动触发提交,两个方法

1)可以将Form的method改为get方式,这样的话如果被拦截,只要选择允许弹框就可以打开新页面

2)将target改为_self,在本页面中打开

2、彻底的解决办法

1)之所以浏览器认为打开新窗口不是由用户主动发起的,是因为ajax的异步请求导致,而ajax不仅可以进行异步请求,也可以进行同步请求,然后就把这段代码的ajax请求改为同步,调试通过,如下:

  1. $.ajax({
  2. url:url,
  3. data:form.serialize(),
  4. dataType: 'json',
  5. async:false
  6. }).done(function(o){
  7. if(o.success){
  8. if(o.data){
  9. window.open('http://www.XXX.com');
  10. }else{
  11. newwin.close();
  12. $(document).trigger('simpleDialog',['#dialog-has-order']);
  13. }
  14. }else{
  15. _onFailure();
  16. }
  17. }).fail(_onFailure);

但是这种方法虽然解决了问题,但是也同样失去了我们使用ajax的实衷,而且这种方法在jquery的使用手册里也明确指出,其受到调用的接口的性能影响,如果长时间不响应,势必会锁住浏览器,失去异步响应的优势。
2)后来通过进一步查找,据说淘宝有一种作法,就是在ajax执行之前先打开一个新窗口,这时候是同步的,所以不会有问题,然后在异步调用成功后使用location.href将其指向新的url,如果失败则将该窗口关闭,如下:

  1. var newwindow=window.open("about:blank");
  2. window.focus();
  3. $.ajax({
  4. url:form.attr('action'),
  5. data:form.serialize(),
  6. dataType: 'json',
  7. async:false
  8. }).done(function(o){
  9. if(o.success){
  10. if(o.data){
  11. newwindow.location.href="http://www.XXX.com";
  12. newwindow.focus();
  13. }else{
  14. newwindow.close();
  15. }
  16. }else{
  17. newwindow.close();
  18. }
  19. }).fail(function(){newwindow.close();});

但是这种方法带来一个问题,就是当失败后,会先打开一个窗口,然后再关闭,虽然一闪而过,但是对用户总是一个困扰,相对来说还不如将ajax改成同步,毕竟现在的互联网的访问速度,不至于会将浏览器锁住太长时间。

参考文章:http://blog.csdn.net/yanhandle/article/details/8486638

Ajax异步打开新页面弹框被拦截,无法将参数值传递到后台的更多相关文章

  1. ajax中打开新页面使用window.open方法被拦截的解决方法

    $('.testA').unbind('click').bind('click',function(){ var result=""; $.ajax({ url:'http://l ...

  2. HBuilder mui 手机app开发 Android手机app开发 ios手机app开发 打开新页面 预加载页面 关闭页面

    创建子页面 在mobile app开发过程中,经常遇到卡头卡尾的页面,此时若使用局部滚动,在android手机上会出现滚动不流畅的问题: mui的解决思路是:将需要滚动的区域通过单独的webview实 ...

  3. ajax回调打开新窗体防止浏览器拦截有效方法

    ajax回调打开新窗体防止浏览器拦截,就这么做! 问题剖析:   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 function click_fun(){    window ...

  4. JavaScript关闭窗口的同时打开新页面的方法

    做网页的时候需要弹出一个小窗口,然后要实现一个功能就是鼠标点击超链接关闭小窗口并打开一个新页面,就如同下图: 这是一个小窗口,点击超链接这个窗口会关闭并且会正常在浏览器打开新页面,首先写js关闭窗口的 ...

  5. Web设计中打开新页面或页面跳转的方法 js跳转页面

    Web设计中打开新页面或页面跳转的方法 一.asp.net c# 打开新页面或页面跳转 1. 最常用的页面跳转(原窗口被替代):Response.Redirect("newpage.aspx ...

  6. ASP.NET 后台打开新页面

    [TOC] Response.Write 这是最常见的后台打开新页面的方法. Response.Write("<script>window.open('~/FileView.as ...

  7. Web设计中打开新页面或页面跳转的方法

    一.asp.net c# 打开新页面或页面跳转 1. 最常用的页面跳转(原窗口被替代):Response.Redirect("newpage.aspx"); 2. 利用url地址打 ...

  8. springMVC接受json并打开新页面

    背景:框架中,两个web工程A,B,我的B工程开发了一个对外action接口,A来连,要实现的功能是,A的页面发起一个action请求,到达B的springmvc,通过验证后,打开一个B工程新的tab ...

  9. CefSharp中ChromiumWebBrowser打开新页面处理(_blank)

    原文:CefSharp中ChromiumWebBrowser打开新页面处理(_blank) 版权声明:欢迎转载,但是请保留出处说明 https://blog.csdn.net/lanwilliam/a ...

随机推荐

  1. Windows下Linux 环境 Cygwin安装及配置 基本工具使用

    用久了Ubuntu开发环境,切换到windows多少有些不爽,想在windows下享用linux便捷的工具可以安装强大的Cygwin,本人也是初次使用中学习.本文主要目的让你可以通过cygwin使用基 ...

  2. 开始整理iOS职位面试问题及答案

    Object-c的类可以多重继承么?可以实现多个接口么?Category是什么?重写一个类的方式用继承好还是分类好?为什么? 答: Object-c的类不可以多重继承;可以实现多个接口,通过实现多个接 ...

  3. Orchard运用 - 定制呈现最新博客文章

    每个博客系统为了吸引更多访问量,一般都会在首页或侧边栏列举一些最新文章/随笔以获取更多点击.其实也就是查询出最新的几篇文章并按照简练的方式呈现,比如一般都只有标题及其对应的链接,有时也会标注一下作者和 ...

  4. csm pssm +pcf pcss sdsm

    这几个shadow算法 pcf是sample时候用的 按照一个mode采样几个位置 根据采样结果 决定0-1  可以是0.234 这样就不是 0或者1 就是soft了 主要讲下pcss 是啥 因为我之 ...

  5. 给电脑装完系统之后,发现U盘少了几个G!

    我的U盘是8个G的,有一次用U盘给电脑装完系统,过了几天后再次用的时候发现U盘 突然少了几个G,刚开始不知道怎么回事,然后就格式化U盘,但是格式化之后没有任何 变化. 在网上搜了一下,说是U盘有可能被 ...

  6. [简谈]绕过HR破门而入的求职智慧

    以往我们在网上看到的非常多求职文章或指导性纲领,譬如啥自信.做功课.良好形象.华丽的简历.工作经验.口才啥的,事实上到了21世纪尤其是互联网快速发展的今天,前面这些技巧就显得无比空洞: 1.由于自信谁 ...

  7. 使用Nodejs的Nodemailer通过163信箱发送邮件例程

    首先需要安装一下nodemailer #nmp nodemailer install --save 然后就参照官方文档的例程改写一下就行了,代码如下: 'use strict'; const node ...

  8. JAVA设计模式之 訪问者模式【Visitor Pattern】

    一.概述 訪问者模式是一种较为复杂的行为型设计模式,它包括訪问者和被訪问元素两个主要组成部分.这些被訪问的元素通常具有不同的类型,且不同的訪问者能够对它们进行不同的訪问操作.在使用訪问者模式时,被訪问 ...

  9. STL - C++ 11的Lambda表达式(下)

    关于lambda的基础知识,请参考上一篇的地址如下: http://www.cnblogs.com/davidgu/p/4825625.html 我们再举个STL使用Lambda来进行排序的例子,如下 ...

  10. Java浮点运算-BigDecimal

    package com.hsun.test; import static java.lang.System.out; import java.math.BigDecimal; public class ...