Version complète: sur le forum Webmaster Hub : Fonction non accessible par IE 6 et 7 (Win XP) et Safari 3 (Mac et Windows) (Object attendu)
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > AjaX et JavaScript
josiasseb
jeudi 10 janvier 2008 à 15:17
Bonjour,

J'ai un soucis avec une page en XHTML 1.0 Transitional. qui contient du code Javascript/CSS affichant ou masquant des lignes tr.
Tout fonctionne bien excepté sous IE et Safari ou rien ne se passe, hormis l'erreur 'Objet attendu' super explicite sous Windows.

Voici le début de mon code ainsi qu'une des lignes appelant la fonction js:

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0
Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>Quantinemo</title>
<script type='text/javascript'>
function showHide(class, ID)
{
var allHTMLTags = new Array();
var allHTMLTags=document.getElementsByTagName('tr');
for (i=0; i<allHTMLTags.length; i++) {
if (allHTMLTags[i].className==class) {
if (allHTMLTags[i].style.display == 'none') {
allHTMLTags[i].style.visibility='visible';
allHTMLTags[i].style.position='static';
allHTMLTags[i].style.display='table-row';
ID.innerHTML='Hide';
} else {
allHTMLTags[i].style.visibility='hidden';
allHTMLTags[i].style.position='absolute';
allHTMLTags[i].style.display='none';
ID.innerHTML='Show';
}
}
}
}
...
</script>

...

<tr>
<td colspan='10' align='center'><a href='#' onclick="showHide('Name-and-Time', this); return false;" id='show0'>Show</a> &nbsp;&nbsp;<i>Name and Time</i>&nbsp;&nbsp; category</td>
</tr>
<tr class="Name-and-Time" style="position:absolute; margin: 0 auto; display: none; visibility:hidden;">
<td align="center">base_file_name</td>
...

Le debuggeur de script Microsoft me dit que la première erreur via de cette ligne: <script type='text/javascript'>

Cette page fonctionne bien sous Linux (Firefox, Konqueror, Opera, Netscape) ainsi que sous Windows XP pour les mêmes navigateurs (Hors Konqueror).

Une idée ?
Merci

--
Sébastien
josiasseb
vendredi 11 janvier 2008 à 08:24
Je précise en plus que la page est bien W3C conforme (Ca veut pas dire grand chose pour IE mais quand même) et que la console javascript de Firefox ne renvoie aucune erreur.
iNCiTE Web
vendredi 11 janvier 2008 à 09:24
Il y a 2 problèmes :
- tu utilises "class" comme nom de variable, c'est un mot réservé donc ça met le bazar. A renommer en "classe" par exemple, tu n'as plus l'erreur Javascript
- ensuite il y a un problème avec la propriété display "table-row", il ne vaut mieux pas l'utiliser.
Remplaces
CODE
allHTMLTags[i].style.display='table-row';
par
CODE
allHTMLTags[i].style.display='';
et ça fonctionne...
josiasseb
vendredi 11 janvier 2008 à 10:54
CITATION(iNCiTE Web @ vendredi 11 janvier 2008 à 09:24) *
Il y a 2 problèmes :
- tu utilises "class" comme nom de variable, c'est un mot réservé donc ça met le bazar. A renommer en "classe" par exemple, tu n'as plus l'erreur Javascript
- ensuite il y a un problème avec la propriété display "table-row", il ne vaut mieux pas l'utiliser.
Remplaces
CODE
allHTMLTags[i].style.display='table-row';
par
CODE
allHTMLTags[i].style.display='';
et ça fonctionne...


Merci infiniment !
Je séchais complètement.

Désormais la page fonctionne avec tous les navigateurs courants sous Linux, Mac et Windows (même avec IE 4 !)


J'ai une autre question, concernant l'affichage des lignes inter-TR du tableau cachés que IE affiche quand même malgré les display:none et visibility:hidden.
Je vais la poster sur la liste HTML/CSS, à moins que tu ne saches.

Encore merci
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.