IE11 se bloque en effaçant un formulaire avec 5 champs ou plus en utilisant JQuery $ (…) .val ("")

Si je nettoie un formulaire avec 5 champs ou plus dans IE11 en utilisant $ ('entrée de formulaire'). Val ("") IE11 va se bloquer. HTML:

<form> <label>1</label><input type="text"/> <label>2</label><input type="text"/> <label>3</label><input type="text"/> <label>4</label><input type="text"/> <label>5</label><input type="text"/> </form> 

JS:

  • Ce qui vaut mieux: <script type = "text / javascript"> ... </ script> ou <script> ... </ script>
  • Arrêter la soumission de formulaire avec submit eventlistener
  • Puis-je désactiver l'antialiasing sur un élément HTML <canvas>?
  • Code Javascript fonctionne dans jsfiddle et pas dans le navigateur
  • Formulaire HTML en lecture seule SELECT tag / input
  • Comment cacher la barre d'adresse d'une page Web dans Android?
  •  $(document).ready(function(){ $('#clearFormNormal').click(function(){ $("form input").val(""); }); }); 

    Quand je fais ce récursif et avec un setTimeout, ça marche.

    JS:

     function clearFields (counter) { var i = counter || 0, deferred = new $.Deferred(); if ($("form input").eq(i).length === 1){ setTimeout(function(){ $("form input").eq(i).val(""); i = i + 1; clearFields(i).always(function(){ deferred.resolve(); }); },0); } else { deferred.resolve(); } return deferred.promise(); } $(document).ready(function(){ $('#clearFormSetTimeout').click(function(){ clearFields(); }); }); 

    Voir aussi http://jsfiddle.net/fransoverbeek/Cy5D5/7/

    Est-ce un bug IE11?

  • JQuery - Comment sélectionner par attribut
  • Img onload ne fonctionne pas bien dans IE7
  • Lier la zone de texte à la touche 'entrer'
  • Html - change la langue en utilisant element.lang
  • Quel mode utilisent les utilisateurs lors de l'utilisation d'Emacs pour éditer des pages Web contenant CSS, javascript et HTML?
  • Sélection de niveau multiple en html
  • 6 Solutions collect form web for “IE11 se bloque en effaçant un formulaire avec 5 champs ou plus en utilisant JQuery $ (…) .val ("")”

    Je crois qu'il s'agit d'un bug IE et j'ai créé le rapport de bug de connexion suivant: https://connect.microsoft.com/IE/feedback/details/811930/ie11-crash-when-clearing-multiple-input-fields- Avec jquery

    J'ai ajouté une version légèrement modifiée de votre fonction récursive là-bas en tant que travail. La fonction est légèrement plus générique et ressemble à ceci:

     function clearFields (counter, selector) { var i = counter || 0, deferred = new $.Deferred(); if (selector.eq(i).length === 1){ setTimeout(function(){ selector.eq(i).val(""); i = i + 1; clearFields(i, selector).always(function(){ deferred.resolve(); }); },0); } else { deferred.resolve(); } return deferred.promise(); } $(document).ready(function(){ $('#clearFormNormal').click(function(){ $("form input").val(""); }); $('#clearFormSetTimeout').click(function(){ clearFields(0, $("form input")); }); }); 

    Veuillez voter sur le problème de connexion.

    Fonctionnement de la fonction clearFields:

    Tout d'abord, notez que je n'ai pas écrit la fonction originale qui était basée sur, donc le pourquoi de ce travail n'est qu'une conjecture de ma part.

    La fonction clearFields est une fonction récursive. Chaque fois qu'il s'exécute, il faut deux paramètres: le compteur (qui est l'index dans l'ensemble des champs à effacer) et le sélecteur (l'objet jquery qui contient l'ensemble des champs à effacer)

    La fonction crée des regards sur l'élément spécifié par le compteur dans l'ensemble des éléments DOM spécifiés par le sélecteur. Si un tel élément existe, il crée un setTimeout asynchrone qui effacera cet élément. Cette fonction asynchique augmente le compteur (qui s'appelle i ici) et appelle récursivement clearFields. Je crois que la récursivité est la clé car j'ai essayé d'utiliser un setTimeout en boucle et cela n'a pas fonctionné.

    La récursivité s'arrête lorsque le compteur dépasse l'indice du dernier élément dans la collection qui est quand selector.eq (compteur) .length! == 1

    Je pense que cette fonction pourrait encore être améliorée en échangeant l'ordre des paramètres du compteur et du sélecteur afin que le compteur soit optionnel pour le premier appel.

    Je n'ai jamais eu besoin d'utiliser le code jQuery différé avant, alors je ne sais pas quel rôle joue dans cette fonction.

    Je crois que c'est un bug d'IE et qu'il n'est pas lié à jQuery, car il est possible de le montrer simplement par la page html suivante comme:

     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"></meta> <title>test</title> </head> <body> <form id="form_1"> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="text" value="" size="10"/><br/> <input type="button" value="reset" onclick="document.getElementById('form_1').reset();"> </form>. </body> </html> 

    On peut constater que IE 11 va se bloquer après avoir réinitialisé le formulaire.

    essayer

      $(':input',"#" + form.id) .not(':button, :submit, :reset, :hidden') .val(''); 

    ou

     $("#" + form.id)[0].reset(); 

    Cochez cette case de saisie du fichier d'effacement dans Internet Explorer

    La correction de ce bug a été incluse dans les mises à jour IE pour février 2014 publiées aujourd'hui sur Windows Update.

    Je pense que c'est un bug dans Internet Explorer 11. J'ai signalé un bug similaire sur Microsoft Connect. J'ai pu reproduire les problèmes que j'ai rencontrés avec et sans jQuery.

    Sur le rapport de bogue, il existe une solution de contournement très simple (et assez surprenante) (découverte par philbee21). Avant d'attribuer la chaîne vide, définissez d'abord la valeur dans un seul espace:

     fields.forEach(function (field) { field.value = ' '; field.value = clearValue; }); 

    J'ai créé un violon mis à jour .

    Cela semble résoudre le problème:

     $(document).ready(function(){ $('#clearFormNormal').click(function(){ $("form input").val($("form input").val()); $("form input").val(""); }); }); 

    Je ne sais pas pourquoi, mais ma théorie est que le fait de définir la valeur du champ à sa valeur actuelle réinitialise une référence nulle.

    Consultez le JS Fiddle ici: http://jsfiddle.net/Cy5D5/22/

    JavaScript rend le site Web intelligent, beauté et facile à utiliser.