J'essaie de retarder une demande Ajax afin qu'elle soit envoyée 2-3 secondes après la dernière clé d'une cellule d'entrée.
Jusqu'à présent, j'ai réussi à retarder les demandes, mais après 2-3 secondes, je reçois une demande envoyée pour chaque clé de clé dans le champ ...
Comment puis-je faire annuler JQuery les premiers et envoyer le dernier porte-clés?
Voici le code jusqu'à présent:
function ajaxSearchRequest($type){ var ajaxRequest2; // The variable that makes Ajax possible! try{ // Opera 8.0+, Firefox, Safari ajaxRequest2 = new XMLHttpRequest(); }catch (e){ // Internet Explorer Browsers try{ ajaxRequest2 = new ActiveXObject("Msxml2.XMLHTTP"); }catch (e) { try{ ajaxRequest2 = new ActiveXObject("Microsoft.XMLHTTP"); }catch (e){ // Something went wrong alert("Browser error!"); return false; } } } ajaxRequest2.onreadystatechange = function(){ if(ajaxRequest2.readyState == 4){ $result = ajaxRequest2.responseText; $('#resultcontainer').html($result); }} var searchterm = document.getElementById($type).value; var queryString ="?searchterm=" + searchterm +"&type=" +$type; if(searchterm !== ""){ ajaxRequest2.open("GET", "searchrequest.php" + queryString, true); ajaxRequest2.send(null); } }
3 Réponses :
stocker le délai d'attente dans une variable, vous pourrez donc effacer les délais d'attente récents:
clearTimeout(window.timer); window.timer=setTimeout(function(){ // setting the delay for each keypress ajaxSearchRequest($type); //runs the ajax request }, 3000);
Je vais vous donner un +1 lorsque vous le faites sans stocker cette valeur dans une variable globale ...
Thanx beaucoup, ça a fonctionné, voici le code final: `$ ('# nom de nom'). Focus (fonction () {$ ('termes: entrée'). Val (" "). Keyup (fonction ( ) {casquettes (ceci); $ Type = $ (ceci) .attr ("id) (" id "); window.timer = settimeout (fonction (fonction () {// Définition du délai pour chaque touche AjaxSearcherRequest ($ Type); // exécute le Demande Ajax}, 3000);}). Clé (Fonction () {Cleartimeout (Window.Timer);});
FFS C'est l'exemple de code. Il n'a pas besoin d'une fermeture pour que la solution soit apparente.
J'aime la réponse de Molle, mais je voudrais améliorer encore les performances Ce changement entraînera une demande Ajax et d'envoyer une nouvelle demande. C'est utile lorsque vous P> dactylographié-> attendu 4 sec -> Demande envoyée -> Type à nouveau (réponse non reçue) -> Attendu 4 secondes -> Autres feux de demande P> P> P> P> P>
Parce que c'est une mauvaise réponse? Abandonner les demandes Ne vous aidez pas - les serveurs (généralement) conservent les requêtes de traitement. Le bon correctif n'est pas de continuer à envoyer des demandes d'envoi.
Mais cela diminue les frais généraux du réseau. Et résout le problème d'obtenir plusieurs réponses si vous êtes un peu lent dans la frappe.
Non, n'envoie pas les demandes i> "diminuer les frais de réseau". Annulation d'une demande AJAX arrête simplement la réponse éventuelle d'atteindre le rappel.
J'apprécie toute citation de remettre votre argument selon lequel "abandonner ne diminue pas la surcharge de réseau et arrête simplement les données à recevoir au rappel"
Il devrait être de bon sens que pas b> d'envoi de demandes d'envoi en premier lieu i> a une surcharge de réseau moindre que d'envoyer des demandes mais en les abandonnant.
Bien sûr que non pas d'envoi de demande a moins de frais généraux. Mais l'annulation est mieux que de ne pas annuler. Je pense que c'est aussi un bon sens. Je demanderais @krasatos de l'utiliser et de vous faire savoir que s'il a pratiquement amélioré la performance ou non. J'ai utilisé cette technique avant et vu beaucoup d'amélioration pratiquement!
Ne pas envoyer en premier lieu vaut mieux que d'envoyer et d'annuler. Quelle est la solution évidente et déjà acceptée.
Peut-être que vous n'avez pas encore compris le flux complet. Veuillez lire les dernières lignes de ma réponse. Si vous appuyez sur quelques touches, attendez. La demande est envoyée. Puis, après 4 secondes, vous tapez à nouveau. Ensuite, une autre demande sera envoyée. Mon code consiste à arrêter l'ancienne demande (si elle est envoyée et réponse non reçue). Fondamentalement, c'est une amélioration étendue de la réponse acceptée.
Qu'est-ce que vous essayez de faire est appelé déboquage fort>. p>
voici un plugin JQuery par Ben Alman qui fait le travail. p>
et Underscore.js inclut également cette fonctionnalité. P>
Il y a vraiment
Postez le code de
AjaxSearcherRequest code>
@Imdad pourquoi est-ce nécessaire? Vous pouvez déjà voir chaque porte-clés faisant un nouveau délai d'attente sans annuler les précédents.
Il y a d'autres travaux autour. Je ne peux dire que si je sais quelle est la fonction
Existe-t-il un moyen d'annuler l'événement de retard »sur .keydown? Donc, s'il n'y a pas d'autre clé, l'événement de Keyup se produira réellement?
@krasatos La solution consiste simplement à annuler précédemment (
.cleartimeout code>) lorsque vous définissez un nouveau délai d'attente. Ensuite, le dernier délai d'attente de clé de clé ne sera pas annulé.
Bonne façon. Je n'ai pas pensé à ça +1.