window.open 彈出窗口在點擊事件期間被阻止

Question

我最終需要做的是運行$.ajax()調用，然后在運行之后，打開一個新的 window。

用戶單擊“預覽”按鈕以保存其當前表單，然后打開一個新的 window，其中顯示項目的預覽以及剛剛保存的數據。

但按原樣， window.open function 被彈出窗口阻止程序阻止。

這是我的代碼的基本部分：

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) 在調用$.ajax window.open保存 window 參考：

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

2) 在已保存的 window 參考的回調設置location屬性上：

newWindow.location = url;

也許它也會幫助你。

Answer 2

彈出窗口阻止程序通常會阻止顯示的每個未由直接用戶操作觸發的彈出窗口，例如單擊按鈕或鏈接。

如果您在單擊事件上使用 ajax 請求，則該請求與單擊事件異步觸發，這就是為什么當 ajax 請求完成其工作並且您通過請求的響應獲得事件時，您已經失去了機會在沒有彈出窗口阻止程序的情況下觸發 window.open ，原來的點擊事件到那時早就死了。

Answer 3

根據這篇這篇文章，看起來您必須打開 window 以直接響應點擊（以避免被彈出窗口阻止程序擊中），而不是等到 AJAX 調用完成才能打開新的 Z05B8C74CBD96FBF2DE4C1A3527。

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
  }
}