Comment gérer l'interception lors de l'ouverture d'une nouvelle fenêtre dans la réponse à la demande Ajax

Cette fois, je vais vous présenter comment gérer l'interception de l'ouverture d'une nouvelle fenêtre dans la réponse à la demande Ajax. Quelles sont les précautions lors de l'interception de l'ouverture d'une nouvelle fenêtre dans l'Ajax. demande de réponse. Ce qui suit est un cas pratique. Levez-vous et jetez un œil.

1. Description du problème

Une fois la requête asynchrone asynchrone réussie, vous devez ouvrir une nouvelle fenêtre pour ouvrir l'URL et utiliser window.open(), mais elle sera interceptée par le navigateur et nécessitera que l'utilisateur clique.

2. Analyse du problème

La raison pour laquelle le navigateur intercepte les fenêtres nouvellement ouvertes est que l'opération n'est pas déclenchée activement par l'utilisateur, donc il pense que This est intercepté car il n'est pas sûr. Même si la fonction de rappel ajax simule le comportement de l'utilisateur tel qu'un clic ou une soumission (trigger('click')), le navigateur pensera qu'il n'est pas activement déclenché par. l'utilisateur, il ne peut donc pas être exécuté en toute sécurité, il est donc intercepté.

Instructions :

1. S'il est en javascript:void(0)" onclick="fun()"> L'appel de window.open() dans la méthode fun spécifiée ici ne sera pas intercepté, car le navigateur pensera qu'elle est active. Mais l'ouverture d'une fenêtre en réponse à une requête ajax sera interceptée.

2. Si au lieu d'ouvrir une nouvelle fenêtre, vous modifiez l'adresse d'origine de la page Web, vous pouvez utiliser window.location = newurl pour y parvenir, afin qu'elle ne soit pas interceptée.

3. Solution

Avant la requête ajax, utilisez window.open pour ouvrir une fenêtre vide, puis dans la fonction de réponse ajax Set l'attribut location de la fenêtre à la nouvelle URL.

Les exemples de code sont :

function fun(){
var tmpWin =window.open()
ajax(xxx, handle(){ 
//回调函数。这是伪代码，语法不准。
var newurl = xxxx
tmpWin.location = newurl;
})
}

Il y a un problème avec la méthode ci-dessus car une fenêtre vide est ouverte en premier. Si la requête ajax échoue (problème de réseau ou de logique métier), la nouvelle. La fenêtre s'ouvrira. Il n'y aura pas de résultats normaux, ce qui peut prêter à confusion pour l'utilisateur.
Une solution consiste à envisager de donner une invite en cas de problème avec ajax, tel que tmpWin.document.write("Server Processing Exception");

Même pour empêcher le Le temps de réponse ajax est trop long. Lorsque la fenêtre est créée, l'invite tmpWin.document.write("Le serveur est en cours de traitement, veuillez patienter") est immédiatement donnée

Si ajax revient normalement plus tard, c'est parce que l'emplacement est une valeur définie, les informations imprimées d'origine seront écrasées par les informations de la nouvelle page.

Il existe une autre méthode, mais elle présente également des défauts :

Comme ajax peut être défini comme une requête synchrone, vous pouvez utiliser window.open pour ouvrir une nouvelle fenêtre après la requête ajax. Par exemple :

function fun(){
var result;
ajax({ //需要设置同步请求
.....
result = xxx 
.......
}) 
if(result){
window.open(xxxx)
}
}

L'approche ci-dessus évite les problèmes mentionnés ci-dessus car elle ouvre une nouvelle fenêtre après avoir jugé le résultat de la requête ajax.
Cependant, comme il s'agit d'une requête synchrone, nous avons trouvé un problème lors de notre test. Si le temps de réponse du serveur est trop long, d'une part, l'interface se mettra en pause (l'expérience utilisateur n'est pas bonne), et d'autre part, la nouvelle fenêtre s'ouvrira. sera bloqué.

Seulement pas de problème si le serveur revient rapidement. Lors de notre test, nous avons dormi 1 seconde pendant le traitement du code serveur et avons constaté que la nouvelle fenêtre était bloquée.

4. Résumé

En résumé, on peut voir qu'il n'y a pas de moyen particulièrement parfait d'ouvrir une nouvelle fenêtre après le retour d'ajax. Plus précisément, vous devez prendre les mesures appropriées en fonction des caractéristiques commerciales de votre propre système.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment gérer le code tronqué de la soumission Ajax sous IE

Explication détaillée des étapes pour ajax pour envoyer des types de données au serveur

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!