window.open()在AJAX成功方面有所不同

Question

可能重复:
window.open(url)不同的行为 - 相同的代码,不同的时间

如果我只是向你展示这个例子,那么我将更容易解释这个问题 - > http://jsfiddle.net/RU2SM/
正如你所看到的那样,有2个按钮,一个名为'AjAX',一个叫'直接' ...所以,如果你单击"直接",它会打开窗口(Chrome上的新选项卡),但如果我尝试在AJAX成功处理程序上创建window.open(),则它的工作方式不同.
我确定问题来自AJAX,但我不知道如何修复它.
会欣赏任何好主意.谢谢

Answer 1

这就像一个魅力:

// Direct window.open()
$('#btnDirect').on('click',function(){
    window.open('http://google.com')
})
var success = false;  //NOTE THIS

// AJAX window.open()
$('#btnAJAX').on("click", function(){
    $.ajax({
      url: "/user/login/",
      context: document.body,
      async:false,   //NOTE THIS
      success: function(){  //THIS ALSO CHANGED
         success = true
      }
    });
    if(success){ //AND THIS CHANGED
      window.open('http://google.com')
    }
})

这样做的是当Ajax调用成功时,它将变量success设置为true.
该async:false属性确保在Ajax调用完成后触发if语句.
所以window.open在与直接链接相同的情况下被触发.

Answer 2

问题在于浏览器通常会阻止window.opens,除非它们直接响应用户操作而被调用.这就是你的点击处理程序工作的原因(点击是用户操作)但你的AJAX处理程序没有.

一种解决方案是在初始单击操作期间打开窗口,然后在AJAX成功时更新其位置(或在AJAX失败时再次关闭它).

否则,您必须让用户在其浏览器中明确允许来自您域的弹出窗口.