Explication détaillée de la solution pour window.open intercepté par le navigateur

Récemment, alors que je travaillais sur un projet, j'ai rencontré une situation où l'utilisation de window.open a été interceptée par le navigateur, ce qui a rendu les gens extrêmement déprimés. Bien que la page puisse être publiée dans son propre environnement, pour les utilisateurs, les utilisateurs ne peuvent pas l'être. requis pour réussir l’interception. De plus, lorsqu'une interception se produit, de nombreux novices n'ont aucune idée de ce qui se passe et ne savent pas où regarder la page interceptée.

De plus, on peut constater que lorsque window.open déclenche un événement pour l'utilisateur ou est chargé, il ne sera pas intercepté. Une fois le code pop-up déplacé vers ajax ou un morceau de code asynchrone, il sera immédiatement intercepté. .

Lorsque le navigateur détecte une nouvelle fenêtre contextuelle générée par des opérations non utilisateur, il la bloque. Parce que le navigateur pense que ce n’est pas une page que l’utilisateur souhaite voir.

Par exemple, s'il est exécuté directement dans js, le code suivant :

code js :

 //Ouvrez une page directement window.open('//www.baidu.com', '_blank');

Navigateur ie8 chrome 40 firefox 34 opera 27 safari 5.1.7

S'il faut empêcher NNYYY d'apparaître et pour le code suivant :

code js :

 document.body.addEventListener('click', function() { window.open('//www.baidu.com', '_blank'); });

Tous les navigateurs ne le bloqueront pas.

Pour résumer, chaque navigateur a des jugements différents sur le timing d'interception, et la réponse au code placé dans le rappel ajax est différente, je n'entrerai donc pas dans les détails ici. Cependant, les programmeurs ne souhaitent pas que la fenêtre contextuelle de notre code soit interceptée par le navigateur.

1. Utilisez plutôt une balise

Étant donné la fonction suivante, lier cette fonction au rappel de l'événement click peut éviter l'interception des fenêtres contextuelles par la plupart des navigateurs :

code js :

 function newWin(url, id) { var a = document.createElement('a'); a.setAttribute('href', url); a.setAttribute('target', '_blank'); ', id); // Empêcher les ajouts répétés if(!document.getElementById(id)) document.body.appendChild(a.click();}

2. Utilisez la méthode de soumission du formulaire pour ouvrir une page

Cette méthode nécessite de construire un from, puis de déclencher la soumission du formulaire par le code js, et de soumettre le formulaire à une nouvelle page. Le code est long, donc je ne l'écrirai pas ici. Tout le monde sait qu'il existe un tel formulaire. solution.

Veuillez noter que les deux méthodes ci-dessus ne peuvent pas être placées dans la fonction de rappel ajax. Si elles sont placées dans la fonction de rappel, elles seront toujours interceptées par le navigateur.

3. La solution ultime : ouvrez d'abord la fenêtre, puis redirigez-la

La troisième solution est en fait une solution de contournement. L'idée principale est la suivante : ouvrez d'abord la page via les clics de l'utilisateur, puis redirigez la page. L’exemple de code est le suivant.

code js :

 xx.addEventListener('click', function () { // Ouvrez la page, il est préférable d'utiliser la page d'invite ici var newWin = window.open('loading page'); ajax().done(function() { // Répétez Directement vers la page cible newWin.location.href = 'target url' });

La méthode ci-dessus ouvre en fait deux adresses, il est donc recommandé de donner un message similaire à « La page actuelle est en cours de chargement, veuillez patienter » lors de l'ouverture de la première adresse. . La simple page d'invite de, qui peut éviter d'ouvrir deux fois la véritable page cible et permettre aux utilisateurs de remarquer la redirection de la page.

Deuxième solution :

 <a href=javascript:; onclick=dialog();>Cliquez sur la fenêtre contextuelle</a><script>function dialog(){ $.ajax({ url : 'url', type : 'POST', dataType : 'json ', async : false, // Ceci doit être défini comme des données synchrones : {param1 : 'value1'}, success : function(data){ window.open(data.url, '_blank'); //Initier un fenêtre contextuelle} })} </script>

Inconvénients de cette méthode :

Les tests réels peuvent résoudre le problème d'interception de la plupart des navigateurs, mais ils ne peuvent pas résoudre l'interception des logiciels de sécurité (360 n'interceptera pas, mais QQ Butler le fera)

Ce qui précède représente l’intégralité du contenu de cet article. J’espère qu’il sera utile à l’étude de chacun. J’espère également que tout le monde soutiendra le réseau VeVb Wulin.