document.getElementById -> et Chrome ou ancien IE

utilisateur
Javascript

Bonjour à toutes et à tous,

Voila je rencontre un petit problème avec mon code.

`
<html>
<head>
<title>test</title> 

<script type="text/javascript"> 
    function Show_Categorie_Block_Vente_Autres_animaux(){
        divInfo = document.getElementById('Affiche_Bloc_3_Photos');divInfo.style.display = 'block';     
    //divInfo = document.getElementsByName('Affiche_Bloc_3_Photos')divInfo.style.display = 'block';
    }
    function Show_Categorie_Block_Vente_Accessoires_animaux(){
        divInfo = document.getElementById('Affiche_Bloc_5_Photos');divInfo.style.display = 'block';
    //divInfo = document.getElementsByName('Affiche_Bloc_5_Photos')divInfo.style.display = 'block';     
    }   
</script>

</head>
<body>
<select name="categorie" id="categorie" class="form_cat" style="width:420px" >

<option > vente </option>
<option value="Vente_Autres_animaux"  onclick="Show_Categorie_Block_Vente_Autres_animaux();"> Autres animaux </option>
<option value="Vente_Accessoires_animaux"  onclick="Show_Categorie_Block_Vente_Accessoires_animaux();"> Accessoires animaux </option>
</optgroup>
</select>
<?php
echo '<div id="Affiche_Bloc_3_Photos" name="Affiche_Bloc_3_Photos" style="display: none;">';
    echo'<br/><br/><br/>';
    echo'coucou !';
echo '</div>'; 
echo '<div id="Affiche_Bloc_5_Photos" name="Affiche_Bloc_5_Photos" style="display: none;">';
    echo'<br/><br/><br/>';
    echo'Bonjour !';
echo '</div>';  
?>

</body>

</html>
`

Le but est de faire afficher une div en fonction de ce qui est cliqué dans la liste déroulante.
Fonctionne sous Firefox et nouvelle dernière version d'IE

Le problème est que ni getElementById, ni getElementsByName, ne semble fonctionner avec Chrome et les anciennes versions d'Internet Explorer

Comment faire pour que ça fonctionne sur tout les navigateurs ??

Merci pour votre aide

3 réponses

betaWeb

Salut,

la méthode document.getElementById() fonctionne très bien sous Chrome. Check caniuse pour avoir plus d'infos sur la compatibilité (compatible IE6+, Chrome 1+ etc).
La raison pour laquelle ça ne marche pas ne vient pas de cette méthode, mais sûrement de ton code. Utilise l'event onchange sur ton select plutôt que le onclick sur tes option (c'est ni fait ni à faire d'ailleurs ^^')

Pierrot01

Salut,
Sinon, utiliser JQUERY, c'est lui qui soccupe du navigateur ;)
avant la version 2.0 je crois.
@plus.

utilisateur
Auteur

Bonjour betaWeb,

heum oui effectivement, l'event onchange sur le select fonctionne sauf que du coup ça affiche toutes les div en même temps...
Ici il faut afficher une DIV selon l'option choisie dans le select