Pallier un bug des navigateurs (IE et FF) sur input readonly

Bonjour,
Pour pallier à un bug de certains navigateurs (notamment IE) qui passent à la page précédente lorsqu'on fait un backspace sur un champ readonly, j'ai cherché des infos sur la correction de ce bug. N'en ayant pas trouvé, je crée un écouteur.
Voici mon début de code:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

var inputs = document.querySelectorAll('input[readonly=""], input[readonly="readonly"]'), n=inputs.length; for(i=0; i<n; i++) { alert('toto'); inputs[i].addEventListener('keyDown', function(e) { alert('rrrrr'); console.log(e.target); alert(e.target); //inputs[i].preventDefault; while (parentNode) { let myParent = parentNode; console.log(myParent); alert(myParent); break; } }, false); }

---

Je rentre bien dans la boucle for mais l'écouteur semble n'être jamais appelé.
Le but final est d'arrêter l'envoi du formulaire avec preventDefault.

Après d'autres recherche, j'ai trouvé ce lien https://stackoverflow.com/questions/...nly-input-text mais les solutions indiquées empêchent le focus mais n'empêchent pas le retour à la page précédente.

La solution que j'ai trouvé (avec beaucoup d'aide trouvée sur ce site pour la ligne 3) n'est sûrement pas la meilleure mais elle semble marcher:

Code:

---

1 2 3 4 5 6 7 8 9 10

// Correction d'un bug de certains navigateurs (testé avec IE11, vérifier les autres versions et les autres navigateurs) var reads = document.querySelectorAll('input[readonly]'), others = document.querySelectorAll('input:not([readonly]):not([type="submit"]):not([disabled])'), n = reads.length; for (let i=0; i<n; i++) { reads[i].addEventListener('focus', function(e) { this.blur(); others[0].focus(); }, false); }

---