Archive

Javascript : Erreur “‘xxxxx’ est indéfini” sur IE - La solution

Le javascript est un langage qui parait très souple, mais qui au final ne l’est pas tant que ça….

Il y a un moment de ça je vous parlais de Jslint un site où vous pouvez checker votre syntaxe et ainsi permettre à vos classe ou script Js d’être fonctionnels sur la plupart des navigateur.

Internet Explorer (IE) est reconnu pour les difficultés qu’il donne au développeurs et intégrateurs du monde entier ! C’est en partie pour des problèmes liés aux navigateurs (non prise en compte de la transparence PNG sur IE6, etc..), mais pas totalement. IE 6 et IE 7 sont deux basé sur le même “core”, on va dire ça comme ça, et ce système made by Microsoft est beaucoup plus exigeant en terme de syntaxe. Ainsi un div mal fermé sera toléré et corrigé par Firefox, mais fera tout planter sur IE. Il en est de même pour le Javascript.

Nous en venons au problème du ‘xxxx’ est indéfini… IE6 a l’autre désavantage de n’avoir pas avoir de débuggueur façon Firebug ou Web dev de Firefox. On se retrouve donc bien souvent lors des tests sur les IE avec des trucs qui ne fonctionnent pas et sans plus d’aide que des messages très vagues sur l’origine du problème, un numéro de ligne et basta !

‘xxxx’ est indéfini…

De ce que j’en ai vu et de ce que j’ai déduit de mes nombreux déboire le message “machin est indéfini” peut avoir plusieurs significations dont voici une liste non exhaustive :

  • Dans le cas d’une classe :
    • Cette classe comporte une erreur de syntaxe qui ne permet pas à IE d’interpreter correctement la classe jusqu’à la fin et lorsqu’on fait l’appel de cette classe il renvoi donc ce message (Solution : un petit tour sur Jslint.com suffira dans la plupart des cas)
    • Cette classe est chargé avec d’autres classes, en effet il arrive que certains conflits ne se produisent que sur IE (ça m’est arrivé pas plus tard qu’hier). La solution : il vous faudra voir parmi tous les fichiers Js inclu en même temps que la classe visée, lequel pose problème, puis régler le conflit. Les conflit sont bien souvent générés par des fonctions qui ont le même nom dans les deux classes et qui ne sont pas appellées correctement.
  • Dans le cas d’une variable :
    • Si c’est une variable qui ne dépend que de votre code javascript vérifiez qu’elle soit bien déclarée et qu’aucun faute dans la syntaxe n’empêche IE d’y parvenir.
    • Si c’est une variable qui dépend d’un contenu HTML (si on récupère la valeur d’un champs par exemple ou lors du déclenchement d’un évènement), vérifiez que le code HTML soit correcte puis que le code Js le soit également.

Quelques bonnes pratique pour écrire du Js valide sur IE et partout ailleurs

  • Terminez vos lignes par un point-virgule (;)
  • Ne faite pas de retour chariot inutile
  • N’utilisez pas de raccourci sur les conditions et autres boucle en enlevant les crochets ({}). Ex :on ne met pas if(toto == ‘tata’) var i =1; MAIS if (toto == ‘tata’) var i = 1;
  • Si on fait une condition sur une valeur égal à 0 ou à ” il faut utiliser l’égalité de type et de valeur (=== ou !== selon les cas)
  • On n’écrit pas for(i in toto) mais for (var i in toto)
  • etc…