2009-07-06 8 views
11

Kann mir jemand helfen, ich habe etwas Jquery und Chrome blockiert das Popup, das ich erstelle. Nach einigen Untersuchungen scheint es ein Problem mit window.open im Erfolgsfall eines Ajax-Aufrufs zu sein. Gibt es einen Weg dahin? Mein JQuery Ajax-Aufruf muss die URL zurückgeben, die ich öffnen muss, und so bin ich ein bisschen hängengeblieben.Popup blockiert, jquery window.open im Erfolg: AJAX? outside ok

Wenn ich die open.window außerhalb des Ajax aufrufen, dass es funktioniert, aber innerhalb (Erfolg) ist es blockiert. Ich denke, es hat etwas mit CONTEXT zu tun ist, aber ich bin nicht sicher, ...

Irgendwelche Ideen wirklich zu schätzen ...

Hier ist, was ich habe:

 window.open("https://www.myurl.com"); // OUTSIDE OF AJAX - no problems 
              // with popup 

    $.ajax({ 
     type: "POST", 
     url: "MyService.aspx/ConstructUrl", 
     data: jsonData, 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function(msg) { 
      // Normally loads msg.d that is the url that is returned from service but put static url in for testing 
      window.open("https://www.myurl.com"); // THIS IS BLOCKED 
     }, 
     error: function(msg) { 
      //alert(error); 
     } 
    }); 

Antwort

7

einfach das neue Fenster geöffnet der Erfolg Rückruf:

$.ajax({ 
    type: "POST", 
    url: "MyService.aspx/ConstructUrl", 
    data: jsonData, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function(msg) { 
     window.open("https://www.myurl.com"); 
    }, 
    error: function(msg) { 
     //alert(error); 
    } 
}); 

Hinweis Sie haben könnten für die $ Schnipsel des Asynchron-Option auf false gesetzt, andernfalls wird der Code die $ Schnipsel Aufruf folgende könnte ausgewertet werden, bevor die Antwort empfangen wird.

+0

Excellent! Es funktioniert, vielen Dank! –

+0

Karim, du hast gerade meinen Tag gerettet! – jodeci

+3

Was ist die Verwendung von AJAX (was bedeutet "Asynchronous Javascript And Xml"), wenn Sie es nicht asynchron verwenden? Es gibt mehrere Alternativen, z. B. die Verwendung eines Modals, das Öffnen des Fensters vor der Anforderung, das Anzeigen eines Ladetextes und das Weiterleiten des Fensters nach Abschluss. Ich denke, das ist ziemlich dreckig. – Aidiakapi

2

Firefox Popup-Blockierung basierend auf dem Ereignis, dass der Javascript-Code ausgeführt wird; Beispielsweise kann ein Popup geöffnet werden, das von einem onclick ausgelöst wurde, aber nicht von einem, der von einem setTimeout ausgelöst wurde. Im Laufe der Jahre ist es ein wenig komplizierter geworden, da Werbetreibende versucht haben, den Popup-Blocker von Firefox zu umgehen.

1

Sie können den Code weiterhin im Erfolgsereignis haben, aber async muss falsch sein.

+0

Das Sperren der Benutzeroberfläche scheint in den meisten Fällen ein schlechter Plan zu sein. – wbyoung

7

Ihr Code gibt diese in Firefox und Chrome:

Firefox: "Firefox diese Website verhindert ein Pop-up-Fenster geöffnet." Chrome: "Pop-up blockiert"

Um dieses Problem zu beheben, fügen Sie Ihrem Ajax-Anruf nur async: false hinzu.

$.ajax({ 
type: "POST", 
async: false, 
url: "MyService.aspx/ConstructUrl", 
data: jsonData, 
contentType: "application/json; charset=utf-8", 
dataType: "json", 
success: function(url) { 
    window.open(url); 
}, 
error: function(msg) { 
    //alert(error); 
} 

});

Seien Sie nur vorsichtig, dass async: false javascript zwingen wird, auf jQuery ajax result zu warten. Es bedeutet, dass es Javascript einfriert, bis der Ajax-Aufruf abgeschlossen ist.

+0

Danke @CodingWay –

+0

FYI das funktioniert nicht mehr mit Chrome Version 30 oder IE 10.0.4 – Jazaret

+2

Das Sperren der Benutzeroberfläche scheint in den meisten Fällen ein schlechter Plan zu sein. – wbyoung

17

Wie mehrere Leute darauf hingewiesen haben, funktioniert die angenommene Antwort nicht mehr. Basierend auf dem Kommentar von aidiakapi nutzte ich einen Workaround, indem ich zuerst das Fenster öffnete.

window.open("about:blank", "myNewPage"); 

dann die Ajax-Geschäfte zu machen und in der done() Funktion, öffnen Sie die Seite mit diesem Namen.

window.open("/foo.html", "myNewPage"); 

Dies ist auch egal, wenn Sie es async oder nicht tun.

+0

Dies funktioniert für mich in den neuesten Versionen von Safari, Chrome und Firefox. Es sollte die akzeptierte Antwort sein. – wbyoung

+0

[Ein anderer Weg scheint gut zu funktionieren.] (Http://Stackoverflow.com/a/16361814/98069) – wbyoung

+0

Funktioniert immer noch in der neuesten Firefox + Chrome. :) – mindore

1

die Methode in diesem Beitrag beschriebenen Folgen:

window.open without popup blocker using AJAX and manipulating the window.location

Auf den Punkt gebracht, ist der Ansatz:

  1. Ihr Code muss von einem onclick Ereignis ausgelöst werden.
  2. Öffnen Sie ein neues Fenster, vielleicht zunächst ohne Inhalt, mit window.open --- und speichern Sie einen Verweis auf das Fenster, so dass Sie es später verwenden können.
  3. Verwenden Sie im Erfolgsrückruf von Ihrem AJAX-Vorgang window.location.replace, um die URL Ihres bereits geöffneten Fensters mit der gewünschten URL zu bearbeiten.
0

wenn Sie setzen async: true, dann müssen Sie folgendes tun:

var safariOp = window.open("https://www.myurl.com"); //define before callback ajax contains url . 
$.ajax({ 
    type: "POST", 
    url: "MyService.aspx/ConstructUrl", 
    data: jsonData, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function(msg) { 
     //it's ok on safari 
     safariOp.focus(); 
    }, 
    error: function(msg) { 
     //alert(error); 
    } 
}); 
1
if you put async:true then you must do the following: 

var safariOP = window.open("https://www.myurl.com"); // DEFINE BEFORE AJAX CALLBACK 

$.ajax({ 
    type: "POST", 
    url: "MyService.aspx/ConstructUrl", 
    data: jsonData, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function(msg) { 
     if(safariOP){ 
     safariOP.focus(); // IT'S OK ON SAFARI 
     } 
    }, 
    error: function(msg) { 
     //alert(error); 
    } 
});