Onclick Select ne fonctionne pas dans Chrome

Nouveau WRInaute
Bonjour,

J'ai une select list avec des onclick pour chaque option. Le tout sert à changer de feuille de style suivant l'option sélectionnée.
Le onclick fonctionne bien sur Firefox, mais sur Chrome cela ne fonctionne pas.

Voici mon code :
Code:
<select name="style" id="selectlist" class="selectlist">
    <option value="">-- Changer de style --</option>
    <option value="Light" onclick="document.getElementById('css').href='light.css';">Light</option>
    <option value="Default" onclick="document.getElementById('css').href='default.css';">Default</option>
</select>

Avez-vous une solution s'il vous plaît pour que ça fonctionne sur Chrome (et aussi sur tous les autres navigateurs bien sûr) ?

Merci d'avance pour votre aide.

Cordialement.
 
WRInaute passionné
Avez-vous une solution s'il vous plaît pour que ça fonctionne sur Chrome (et aussi sur tous les autres navigateurs bien sûr) ?

Tu cherches un id 'css' document.getElementById('css') mais je ne le vois pas il faudrait tout le code.

ensuite as tu testé avec des alert si le clic fonctionne et les données que tu récupères sont ok.

Ensuite tu changes la feuille de style après quelle est chargée je pense qu'il faut que tu recharge ta page avec la nouvelle
 
Nouveau WRInaute
Merci ABCWEB pour ta réponse.

Oui pardon, j'ai cette ligne juste avant le code que j'ai donné ci-dessus :

<link id="css" rel="stylesheet" type="text/css" href="default.css"/>

Je n'ai pas testé avec des alert, mais cela fonctionne très bien sur Firefox. Et pareillement pour le changement de style sans recharger la page.
Sur Chrome par contre ça ne fait rien.

Merci :)
 
Nouveau WRInaute
Je viens de tester avec un alert :
<option value="Light" onclick="alert('test');">Light</option>

L'alert s'affiche bien sur Firefox, mais pas sur Chrome.
 
Nouveau WRInaute
Un petit UP, je n'ai toujours pas trouvé de solution à mon problème.
Merci d'avance pour votre aide. :)
 
WRInaute passionné
Si le onclick marche pas sur les options tu peux essayer un onchange sur le select, du genre :

<select onchange="if (this.value === 'Light') document.getElementById('css').href='light.css';"
 
Nouveau WRInaute
Merci Rick38, ça fonctionne bien avec le onchange.

Le code complet :
Code:
<link id="css" rel="stylesheet" type="text/css" href=""/>

<select name="style" id="selectlist" class="selectlist" onchange="if (this.value === 'Light') document.getElementById('css').href='light.css';if (this.value === 'Default') document.getElementById('css').href='common.css'">
       <option value="">-- Changer de style --</option>
       <option value="Default">Default</option>
       <option value="Light">Light</option>
</select>

Merci beaucoup :)
 
WRInaute impliqué
Si la value ne sert à rien de spécial, tu peux l'utiliser pour simplifier ton code.
Code:
<select name="style" id="selectlist">
   <option value="">-- Changer de style --</option>
   <option value="light.css">Light</option>
   <option value="default.css">Default</option>
</select>
<script>
   document.getElementById('selectlist').onchange = function() {
      if (this.value !== '')
         document.getElementById('css').href = this.value;
   }
</script>
 
Discussions similaires
Haut