web-dev-qa-db-ja.com

window.open()の動作はAJAX成功すると異なります

可能性のある複製:
window.open(url)異なる動作-同じコード、異なるタイミング

その例を示すだけで問題を簡単に説明できます-> http://jsfiddle.net/RU2SM/
ご覧のとおり、「AJAX」と「Direct」の2つのボタンがあります。「Direct」をクリックするとウィンドウ(Chromeの新しいタブ)が開きますが、 AJAX=成功ハンドラのwindow.open()を作成します。これは同じようには機能しません。
問題の原因は確かにAJAXですが、修正方法がわかりません。
良いアイデアがあれば高く評価します。ありがとう

15
T1000

これは魅力のように機能します:

// 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 proppertyは、Ajax呼び出しが完了した後にifステートメントが確実に実行されるようにします。
そのため、直接リンクと同じ状況でwindow.openが発生します。

29
Rick Hoving

問題は、ユーザーアクションへの直接の応答で呼び出されない限り、ブラウザーがwindow.opensをブロックすることが多いことです。これがクリックハンドラーが機能する理由です(クリックはユーザーアクションです)が、AJAXハンドラーは機能しません。

1つの解決策は、最初のクリックアクション中にウィンドウを開き、AJAX成功時にその場所を更新する(またはAJAX失敗時に再び閉じる))ことです。

それ以外の場合は、ユーザーがブラウザでドメインからのポップアップを明示的に許可するようにする必要があります。

14
Gareth

より良い方法はajax呼び出しの成功後にロジックを実装します。つまり、すべてのajax呼び出しの実行時にイベントが発生します。つまり、$。ajax.Request.doneおよび$。ajax.Request.failです。 =。 $。ajax.Request.done(function(){if(success){//ロジックを実装する}});

1
zhyder

さらに、async:falseを使用してwindow.openを呼び出すと、chromeおよびfirefoxで機能しますが、サファリで問題が発生する可能性があります...情報も提供されません。ポップアップがブロックされたこと

0
Tobias Krogh