5 votes

jquery ne réagit pas à l'événement de changement de sélection/option

Quelqu'un peut-il me dire où est l'erreur, je ne la vois pas. Le message 'e1 a changé' devrait être enregistré dans la console lorsque la sélection change.

html :

<select name="e1" id="e1">
    <option value="1">1</option>
    <option value="2">2</option>
</select>

js :

$('#e1').change(function() {
    console.log('e1 has changed');
});

jquery fonctionne sans aucun doute puisque je réussis à "récupérer" les données du serveur pour d'autres éléments.

10voto

Adam Rackis Points 45559

Ce code

$('#e1').change(function() {
    console.log('e1 has changed');
});

n'est probablement pas dans votre gestionnaire de document prêt, et est donc exécuté avant votre élément dom e1 est prêt. Vous pouvez créer un gestionnaire de document prêt, qui s'exécutera lorsque vos éléments dom seront prêts, comme ceci

$(function() {
    $('#e1').change(function() {
        console.log('e1 has changed');
    });    
});

1voto

Kris Krause Points 4704

Cela fonctionne pour moi. Voici le code de jsFiddle -

http://jsfiddle.net/CC5P6/

$(document).ready(function() {
  $('#e1').change(function() {
    alert('e1 has changed');
  });
});

1voto

Krister Andersson Points 9788

Si vous ne l'avez pas encore fait, vous devez envelopper votre code dans la balise $(document).ready( :

 $(document).ready(function() {
    $('#e1').change(function() {
       console.log('e1 has changed');
    });
 });

0voto

Savino Sguera Points 2527

Cela fonctionne pour moi :

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
    $(function() {
        $('#e1').change(function() {
            console.log('e1 has changed');
        });
    });
</script>

</head>
<body>
<select name="e1" id="e1">
    <option value="1">1</option>
    <option value="2">2</option>
</select>
</body>
</html>

document.ready est la clé ici, comme d'autres l'ont souligné.

0voto

Pour les menus de sélection, l'événement de changement se produit lorsqu'une option est sélectionnée par les événements des boutons du clavier et de la souris et NoScript n'interfère effectivement pas. Pour les champs de texte ou les zones de texte, l'événement de changement se produit lorsque le champ perd le focus. Vous ne pouvez donc pas utiliser l'événement de changement directement (sans sélectionner une option par le clavier ou la souris). essayez ce code :

<select name="subpos" id="subpos">
<option value="examplel">examplel</option>
<option value="sample">sample</option>
<option value="fortest">fortest</option>
</select>

<script>
    $(function() {
        $('#subpos').change(function() {
            console.log('subpos has changed');
        }); 
        $("#subpos").val('sample');//combo box has change but dont appear in console log. why?
   });
</script>

après l'exécution ; voir le journal de la console vous ne pouvez pas voir 'subpos has changed' dans le journal de la console. mais dans l'action 'subpos has changed'. Que se passe-t-il ? Il devrait être enregistré dans la console lorsque la sélection change. Maintenant, en sélectionnant cette option dans le menu déroulant, vous pouvez voir que le journal de la console est modifié.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X