Onclick Select ne fonctionne pas dans Chrome

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par Bendeb, 21 Mars 2022.

  1. Bendeb
    Bendeb Nouveau WRInaute
    Inscrit:
    21 Mars 2022
    Messages:
    7
    J'aime reçus:
    0
    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.
     
  2. ABCWEB
    ABCWEB WRInaute passionné
    Inscrit:
    22 Octobre 2015
    Messages:
    1 335
    J'aime reçus:
    175
    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
     
  3. Bendeb
    Bendeb Nouveau WRInaute
    Inscrit:
    21 Mars 2022
    Messages:
    7
    J'aime reçus:
    0
    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 :)
     
  4. ABCWEB
    ABCWEB WRInaute passionné
    Inscrit:
    22 Octobre 2015
    Messages:
    1 335
    J'aime reçus:
    175
    Même pas un alert?
     
  5. Bendeb
    Bendeb Nouveau WRInaute
    Inscrit:
    21 Mars 2022
    Messages:
    7
    J'aime reçus:
    0
    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.
     
  6. ABCWEB
    ABCWEB WRInaute passionné
    Inscrit:
    22 Octobre 2015
    Messages:
    1 335
    J'aime reçus:
    175
    T'as pas désactivé le javascript sue chrome?
     
  7. Bendeb
    Bendeb Nouveau WRInaute
    Inscrit:
    21 Mars 2022
    Messages:
    7
    J'aime reçus:
    0
  8. Bendeb
    Bendeb Nouveau WRInaute
    Inscrit:
    21 Mars 2022
    Messages:
    7
    J'aime reçus:
    0
    Un petit UP, je n'ai toujours pas trouvé de solution à mon problème.
    Merci d'avance pour votre aide. :)
     
  9. rick38
    rick38 WRInaute passionné
    Inscrit:
    23 Février 2013
    Messages:
    2 096
    J'aime reçus:
    380
    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';"
     
  10. Bendeb
    Bendeb Nouveau WRInaute
    Inscrit:
    21 Mars 2022
    Messages:
    7
    J'aime reçus:
    0
    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 :)
     
  11. colonies
    colonies WRInaute impliqué
    Inscrit:
    10 Septembre 2006
    Messages:
    683
    J'aime reçus:
    113
    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>
    
     
  12. Bendeb
    Bendeb Nouveau WRInaute
    Inscrit:
    21 Mars 2022
    Messages:
    7
    J'aime reçus:
    0
    Merci Colonies, ça marche aussi comme ça, et c'est plus clair en terme de code. :)
     
Chargement...
Similar Threads - Onclick Select fonctionne Forum Date
onClick select fonctionne pas avec Chrome Développement d'un site Web ou d'une appli mobile 7 Mars 2018
js onclick fait disparaitre le contenu de ma page Développement d'un site Web ou d'une appli mobile 19 Août 2022
Le simple affichage de ma page déclenche les événements onClick... Merci Google Analytics 17 Mai 2022
Accordion jquery : onclick fermer la section ouverte Développement d'un site Web ou d'une appli mobile 13 Février 2020
Afficher valeur id onclick sur checkbox Développement d'un site Web ou d'une appli mobile 21 Février 2018
Attribut onclick pénalisant ? Référencement Google 12 Mai 2017
Est-ce que Google crawl les onclick? Crawl et indexation Google, sitemaps 23 Juillet 2015
afficher masquer on utilisant Onclick Développement d'un site Web ou d'une appli mobile 21 Janvier 2015
Actualiser un div par onclick? Développement d'un site Web ou d'une appli mobile 28 Juin 2012
Insérer un Enregistrer sous sur OnClick Développement d'un site Web ou d'une appli mobile 20 Novembre 2011
Comment empêcher l'indexation de texte après un <a onclick=... Débuter en référencement 4 Novembre 2011
Onclick en 2011 ? :) Débuter en référencement 19 Octobre 2010
Onclick sur <tr></tr> = coché un bouton radio Développement d'un site Web ou d'une appli mobile 31 Mai 2010
2 actions javascript sur un onclick Développement d'un site Web ou d'une appli mobile 15 Juin 2009
Google et les liens JavaScript, les OnClick Référencement Google 8 Juin 2009
Javascript onclick ou nofollow ? Netlinking, backlinks, liens et redirections 20 Mai 2009
JavaScript: OnClick, OnContextMenu, et quoi d'autre ? Développement d'un site Web ou d'une appli mobile 26 Février 2009
Echanges de liens avec d'autres pages que l'index et fct onclick Problèmes de référencement spécifiques à vos sites 23 Janvier 2009
Lien en dur...ou en mou ? (href et onclick) Netlinking, backlinks, liens et redirections 19 Novembre 2008
Submit d'un formulaire onclick lien Crawl et indexation Google, sitemaps 23 Juin 2008