Ich möchte ein JQuery-Dialogfeld unter Vorbehalt des Klickereignisses eines Hyperlinks anzeigen.
Ich habe eine Anforderung wie unter Bedingung1: Öffnen Sie einen JQuery-Dialog. Wenn Bedingung1 nicht erfüllt ist, navigieren Sie zu der Seite, auf die durch das 'href'-Tag verwiesen wird, dessen Klickereignis in Frage kommt.
Ich kann eine Funktion für das Klickereignis des Links aufrufen. Diese Funktion überprüft nun diesen Zustand, indem sie eine andere URL ausführt (die meinen Spring-Controller ausführt und eine Antwort zurückgibt).
Alles funktioniert perfekt, wenn nur window.open vom Popup-Blocker blockiert wird.
$('a[href*=/viewpage?number]').live('click', function(e) {
e.preventDefault();
redirectionURL = this.href;
pageId= getUrlVars(redirectionURL)["number"];
$.getJSON("redirect/" + pageId, {}, function(status) {
if (status == null) {
alert("Error in verifying the status.");
} else if(!status) {
$("#agreement").dialog("open");
} else {
window.open(redirectionURL);
}
});
});
Wenn ich e.preventDefault();
aus dem Code entferne , blockiert der Popoup-Blocker die Seite nicht, öffnet jedoch für Bedingung1 den Dialog sowie die Seite 'href'.
Wenn ich eines löse, entsteht ein Problem für ein anderes. Ich kann nicht beiden Bedingungen gleichzeitig gerecht werden.
Könnten Sie mir bitte helfen, dieses Problem zu lösen?
Sobald dies gelöst ist, muss ich ein weiteres Problem lösen, nämlich die Navigation im OK-Ereignis des Dialogs :)
Antworten:
Popup-Blocker sind normalerweise nur zulässig,
window.open
wenn sie während der Verarbeitung eines Benutzerereignisses verwendet werden (z. B. durch Klicken). In Ihrem Fall rufen Siewindow.open
später an , nicht während des Ereignisses, da$.getJSON
es asynchron ist.Sie haben zwei Möglichkeiten:
Mach etwas anderes als
window.open
.Machen Sie den Ajax-Aufruf synchron, was Sie normalerweise vermeiden sollten, wie die Pest, da sie die Benutzeroberfläche des Browsers blockiert.
$.getJSON
ist äquivalent zu:... und so können Sie Ihren
$.getJSON
Anruf synchronisieren, indem Sie Ihre Parameter den oben genannten zuordnen und Folgendes hinzufügenasync: false
:Auch hier befürworte ich keine synchronen Ajax-Anrufe, wenn Sie einen anderen Weg finden, um Ihr Ziel zu erreichen. Aber wenn du nicht kannst, los geht's.
Hier ist ein Beispiel für Code, der den Test aufgrund des asynchronen Aufrufs nicht besteht:
Live Beispiel | Live-Quelle(Die Live-Links funktionieren aufgrund von Änderungen an JSBin nicht mehr.)Und hier ist ein Beispiel, das mit einem synchronen Aufruf funktioniert:
Live Beispiel | Live-Quelle(Die Live-Links funktionieren aufgrund von Änderungen an JSBin nicht mehr.)quelle
Sie können window.open ohne Browserblockierung nur aufrufen, wenn der Benutzer direkt eine Aktion ausführt. Der Browser sendet ein Flag und bestimmt das durch Benutzeraktion geöffnete Fenster.
Sie können dieses Szenario also ausprobieren:
quelle
myWindow.postMessage
), aber aufgrund der Einschränkung von Safaris, JavaScript nicht im Hintergrund auszuführen, kann das übergeordnete Fenster diese Standortänderung niemals senden.Ich hatte dieses Problem und hatte meine URL nicht bereit, bis der Rückruf einige Daten zurückgab. Die Lösung bestand darin, vor dem Starten des Rückrufs ein leeres Fenster zu öffnen und dann den Ort festzulegen, an dem der Rückruf zurückkehrt.
quelle
action().then(doWindowOpenThing).catch(doSomethingElseThatDoesntOpenAPopup)
Also kann ich ein Fenster nicht vorher öffnen (um seine Referenz zu behalten usw.), wenn ich es später nicht mehr benutze, oder?versuchen Sie dies, es funktioniert für mich,
Ist Geige für diese http://jsfiddle.net/safeeronline/70kdacL4/1/
quelle
Windows muss auf demselben Stapel (auch als Mikrotask bezeichnet ) wie das vom Benutzer initiierte Ereignis erstellt werden, z. B. ein Klick-Rückruf. Sie können daher später nicht asynchron erstellt werden.
Sie können jedoch ein Fenster ohne URL erstellen und die URL dieses Fensters ändern, sobald Sie sie kennen , auch asynchron!
Moderne Browser öffnen das Fenster mit einer leeren Seite (oft aufgerufen
about:blank
). Wenn Ihre asynchrone Aufgabe zum Abrufen der URL ziemlich schnell ist, ist die resultierende UX meistens in Ordnung. Wenn Sie stattdessen eine Lademeldung (oder etwas anderes) in das Fenster rendern möchten, während der Benutzer wartet, können Sie Daten-URIs verwenden .quelle
Dieser Code hilft mir. Hoffe das hilft einigen Leuten
quelle
Versuchen Sie, eine mit einem Link - Elemente und klicken Sie mit javascriipt
und das Skript
Verwenden Sie es so
quelle
Die Beobachtung, dass das Ereignis vom Benutzer initiiert werden musste, half mir, den ersten Teil davon herauszufinden, aber auch danach blockierten Chrome und Firefox das neue Fenster. Der zweite Teil war das Hinzufügen von target = "_ blank" zu dem Link, der in einem Kommentar erwähnt wurde.
Zusammenfassend: Sie müssen window.open von einem vom Benutzer initiierten Ereignis aus aufrufen, in diesem Fall auf einen Link klicken, und dieser Link muss target = "_ blank" haben.
Im folgenden Beispiel verwendet der Link class = "button-twitter".
quelle
das hat bei mir funktioniert.
quelle
Ich verwende diese Methode, um den Popup-Blocker in meinem Reaktionscode zu vermeiden. Es funktioniert auch in allen anderen Javascript-Codes.
Wenn Sie beim Klicken einen asynchronen Aufruf tätigen, öffnen Sie zuerst ein leeres Fenster und schreiben Sie die URL später ein, wenn ein asynchroner Aufruf abgeschlossen ist.
Schreiben Sie nach dem Erfolg eines asynchronen Aufrufs Folgendes
quelle