Question

我最终需要做的是运行$.ajax()调用，然后运行，打开一个新窗口。

用户点击“预览”按钮，保存当前表单，然后打开一个新窗口，显示包含刚刚保存的数据的项目预览。

但是按原样，window.open功能会被弹出窗口阻止程序阻止。

以下是我的代码的基本部分：

HTML：

<a href="/surveys/185/preview" class="preview" target="_blank">Preview</a>

JavaScript的：

$('.preview').live('click', function(event){
  save_survey($(this).attr('href'));
  event.preventDefault();
});

function save_survey(url) {
  $.ajax({
    type: "POST",
    url: form_url,
    dataType: 'json',
    data: form_data,
    success: function(data) {
      window.open(url, '_blank');
    }
  });
}

Answer 1

我最近遇到了这个问题并找到了解决方法：

1）在调用window.open之前调用$.ajax并保存窗口引用：

var newWindow = window.open(...);

2）在保存的窗口引用的回调集location属性上：

newWindow.location = url;

也许它对你有帮助。

Answer 2

弹出窗口阻止程序通常会阻止显示的每个弹出窗口都不是由直接用户操作触发的，例如单击按钮或链接。

如果您在click事件中使用ajax请求，则会从click事件中触发异步请求，这就是为什么当ajax请求完成其工作时，您的事件会得到您丢失的请求的响应你有机会触发一个window.open没有弹出窗口阻止程序阻塞，原来的点击事件已经很久了。

Answer 3

根据这个this post，看起来您必须直接响应点击打开窗口（以避免被弹出窗口阻止程序击中），而不是等到AJAX调用完成后才能打开新窗口

Answer 4

我通过使Ajax调用同步来解决我的问题。例如。（使用jQuery）：

$("form").submit(function(e){
    e.preventDefault();
    $.ajax({
      async: false,
      url: ...,
      data: ...,
      success: function(results){
          if(results.valid){
              window.open(...);
          }
      }
    });
    return false;
  });

Answer 5

const newWin = window.open(`${BASE_URL}`, 'expampleName')
if (newWin) {
  newWin.onload = () => {
    const currentOpenWindow = newWin
    const href = newWin.location.href
  }
}

window.open弹出窗口在单击事件期间被阻止

5 个答案: