onClick select fonctionne pas avec Chrome

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par poupilou, 7 Mars 2018.

  1. poupilou
    poupilou WRInaute impliqué
    Inscrit:
    9 Février 2004
    Messages:
    809
    J'aime reçus:
    10
    Salut à tous,

    J'ai un <select> qui lorsqu'on sélectionne une valeur de la liste déroulante devrait rediriger la page vers une url qui est indiquée dans le onClick="www.monsite.com/page1.html" pour chaque <option> mais ça ne marche pas avec Chrome, pourquoi ?

    Voici mon code : http://jsfiddle.net/tBjkg/214/

    J'ai essayé de remplacer le onClick par un onChange mais ça fonctionne pas mieux avec Chrome.

    Je ne peux pas mettre mes url dans le "value" des <option value="mes url"> car chaque valeur du "value" est utilisé ensuite dans une requête ajax.

    Comment faire pour que ça fonctionne avec Chrome ?

    Merci pour votre aide.
     
  2. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 029
    J'aime reçus:
    291
    HTML:
    <select name="test">
     <option value="value 1" data-url="www.monsite.com/page1.html">value 1</option>
     <option value="value 2" data-url="www.monsite.com/page2.html">value 2</option>
     <option value="value 3" data-url="www.monsite.com/page3.html">value 3</option>
    </select>
    Code:
    document.querySelector('select[name="test"]').onchange = function () {
        console.log(this.value, this.options[this.selectedIndex].dataset.url);
    };
    https://jsfiddle.net/j6Lzr1o6/
     
  3. poupilou
    poupilou WRInaute impliqué
    Inscrit:
    9 Février 2004
    Messages:
    809
    J'aime reçus:
    10
    Merci Spout.

    Par quel code remplacer console.log(this.value, this.options[this.selectedIndex].dataset.url); pour que la redirection vers l'url se fasse ?

    J'ai essayé ce code mais la redirection ne marche pas :
    Code:
    document.querySelector('select[name="test"]').onchange = function () {
        document.location.href='this.options[this.selectedIndex].dataset.url';
    };
    
     
  4. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 029
    J'aime reçus:
    291
    document.location.href=this.options[this.selectedIndex].dataset.url;
     
  5. cthierry
    cthierry WRInaute passionné
    Inscrit:
    15 Janvier 2005
    Messages:
    2 222
    J'aime reçus:
    47
    HS Ton titre fait bug la page d'accueil de WRI avec le on click select qui s'affiche comme du code :) /HS
     
    spout et Madrileño aiment ça.
  6. poupilou
    poupilou WRInaute impliqué
    Inscrit:
    9 Février 2004
    Messages:
    809
    J'aime reçus:
    10
    Ah oui ça marche mieux comme ça :)

    Le problème c'est que je peux avoir 2 types de data-url dans mes <option> comme cela :
    Code:
    <option value="value 2" data-url="www.monsite.com/page2.html">value 2</option>
    <option value="value 3" data-url="getAjaxMaFonction();">value 3</option>
    
    Dans le cas de <option value="value 3" data-url="getAjaxMaFonction();">value 3</option> ça ne déclenche pas ma fonction ajax getAjaxMaFonction(); comment régler ce problème ?
     
  7. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 029
    J'aime reçus:
    291
  8. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 029
    J'aime reçus:
    291
    @WebRankInfo : petite anectode amusante, le titre de ce topic montre qu'il y a une faille XSS sur la homepage de WRI.
    Rapporté par @cthierry


    [​IMG]
     
    cthierry apprécie ceci.
  9. WebRankInfo
    WebRankInfo Admin
    Membre du personnel
    Inscrit:
    19 Avril 2002
    Messages:
    19 691
    J'aime reçus:
    439
    oups ! corrigé, merci du signalement
     
  10. poupilou
    poupilou WRInaute impliqué
    Inscrit:
    9 Février 2004
    Messages:
    809
    J'aime reçus:
    10
    Merci Spout ça marche nickel, tu es vraiment d'une aide précieuse :)

    ...et désolé pour la faille XSS... :)
     
Chargement...
Similar Threads - onClick select fonctionne Forum Date
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
  1. Ce site utilise des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation des cookies.
    Rejeter la notice