Intereting Posts

Afficher l'identifiant multi-sélection par js

J'ai besoin d'un identifiant de sélection d'affichage par js, par ce code ne montre que 1 et le premier identifiant de sélection

Mon code est ce html et javascript

<tr> <td> <select name="jens_id[]" id="jens_id" required="" > <option ></option> <option >1</option> <option >2</option> </select> </td> </tr> <tr> <td> <select name="jens_id[]" id="jens_id" required="" > <option ></option> <option >1</option> <option >2</option> </select> </td> </tr> <script> $(document).ready(function(){ $('#jens_id').change(function(){ statteId = $("#jens_id").val() alert(statteId); }); }); </script> 

Peut aider à modifier le script

L'attribut id doit être unique dans la page sinon le premier est sélectionné (en utilisant le sélecteur d'identification), pour un groupe d'éléments utiliser une classe commune à la place et dans le gestionnaire d'événements de changement, utilisez this pour renvoyer l'élément cliqué.

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td> <select name="jens_id[]" class="jens_id" required=""> <option ></option> <option >1</option> <option >2</option> </select> </td> <td></td> </tr> <tr> <td> <select name="jens_id[]" class="jens_id" required=""> <option ></option> <option >1</option> <option >2</option> </select> </td> <td></td> </tr> </table> <script> $(document).ready(function() { // or use attribute equals selector // $('[name="jens_id[]"]') $('.jens_id').change(function() { statteId = $(this).val(); // or this.value console.log(statteId); // get the td and update with value $(this).parent().next().text(statteId); }); }); </script> 

Essayez avec each() fonction each() de jquery. Et modifiez le sélecteur avec Tagname ou ClassName au lieu de id .Id est un document unique pour un document complet

 $(document).ready(function() { $('select').each(function(){ console.log($(this).val()) }) }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <tr> <td> <select name="jens_id[]" id="jens_id" required=""> <option ></option> <option selected>1</option> <option >2</option> </select> </td> </tr> <tr> <td> <select name="jens_id[]" id="jens_id" required=""> <option ></option> <option >1</option> <option selected>2</option> </select> </td> </tr> 
 $(document).ready(function() { $('.jens_id').change(function() { statteId = $('option:selected', this).text() alert(statteId); }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select name="jens_id[]" class="jens_id" required=""> <option ></option> <option >1</option> <option >2</option> </select> <select name="jens_id[]" class="jens_id" required=""> <option ></option> <option >3</option> <option >4</option> </select> 

Vous êtes déjà conscient que l'identifiant de l'élément sur la page devrait être unique.

Lorsque vous avez plusieurs éléments avec le même identifiant, le sélecteur id(#) renvoie le premier élément apparié. Donc, comme mentionné dans d'autres réponses, vous devez utiliser la classe si possible.

Par quelque raison que ce soit, si vous ne pouvez pas utiliser la classe et que vous souhaitez trouver avec un identifiant, vous pouvez l'utiliser comme $('select#jens_id') ou $('[id="jens_id"]') et pour obtenir l'option sélectionnée Utilisez un contexte à l'intérieur de this ci qui trouvera l'option sélectionnée pour l'élément sélectionné modifié.

 $(document).ready(function() { $('select#jens_id').change(function() { alert($(this).find('option:selected').text()); }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select name="jens_id[]" id="jens_id" required=""> <option ></option> <option >1</option> <option >2</option> </select> <select name="jens_id[]" id="jens_id" required=""> <option ></option> <option >3</option> <option >4</option> </select>