it-swarm.com.de

jquery select change event get selected option

Ich habe ein Ereignis mit dem Änderungsereignis meiner ausgewählten Elemente verknüpft:

$('select').on('change', '', function (e) {

});

Wie kann ich auf das Element zugreifen, das beim Eintreten des Änderungsereignisses ausgewählt wurde?

222
Zulakis
$('select').on('change', function (e) {
    var optionSelected = $("option:selected", this);
    var valueSelected = this.value;
    ....
});
429
Neal

Sie können die Methode jQuery find verwenden

 $('select').change(function () {
     var optionSelected = $(this).find("option:selected");
     var valueSelected  = optionSelected.val();
     var textSelected   = optionSelected.text();
 });

Die obige Lösung funktioniert einwandfrei, aber ich füge den folgenden Code hinzu, um die angeklickte Option zu erhalten. Damit können Sie die ausgewählte Option auch dann erhalten, wenn sich dieser Auswahlwert nicht geändert hat. (Nur mit Mozilla getestet)

    $('select').find('option').click(function () {
     var optionSelected = $(this);
     var valueSelected  = optionSelected.val();
     var textSelected   = optionSelected.text();
   });
72
Bellash

Delegierte Alternative

Falls jemand den delegierten Ansatz für seinen Listener verwendet, verwenden Sie e.target (dies bezieht sich auf das select-Element).

$('#myform').on('change', 'select', function (e) {
    var val = $(e.target).val();
    var text = $(e.target).find("option:selected").text(); //only time the find is required
    var name = $(e.target).attr('name');
}

JSFiddle Demo

15
slicedtoad

Ich finde das kürzer und sauberer. Außerdem können Sie ausgewählte Elemente durchlaufen, wenn mehrere vorhanden sind.

$('select').on('change', function () {
     var selectedValue = this.selectedOptions[0].value;
     var selectedText  = this.selectedOptions[0].text;
});
5
1.44mb
<select id="selectId">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>


$('#selectId').on('change', function () {
     var selectVal = $("#selectId option:selected").val();
});

Erstellen Sie zuerst einen select option. Danach können Sie mit jquery den aktuell ausgewählten Wert abrufen, wenn der Benutzer den Wert select option ändert.

5
user6270989
$('#_SelectID').change(function () {
        var SelectedText = $('option:selected',this).text();
        var SelectedValue = $('option:selected',this).val();
});
2
Serdar Karaca

Ein weiterer und kurzer Weg, um den Wert des ausgewählten Wertes zu erhalten,

$('#selectElement').on('change',function(){
   var selectedVal = $(this).val();
                       ^^^^  ^^^^ -> presents #selectElement selected value 
                         |
                         v
               presents #selectElement, 
});
1
Recep Can

Sie können dieses Änderungsereignis für jquery select verwenden, um den ausgewählten Optionswert zu erhalten

Für Demo

$(document).ready(function () {   
    $('body').on('change','#select', function() {
         $('#show_selected').val(this.value);
    });
}); 
<!DOCTYPE html>  
<html>  
<title>Learn Jquery value Method</title>
<head> 
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> 
</head>  
<body>  
<select id="select">
 <option value="">Select One</option>
    <option value="PHP">PHP</option>
    <option value="Java">Java</option>
    <option value="Jquery">jQuery</option>
    <option value="Python">Python</option>
    <option value="Mysql">Mysql</option>
</select>
<br><br>  
<input type="text" id="show_selected">
</body>  
</html>  
0
Developer

Siehe offizielle API-Dokumentation https://api.jquery.com/selected-selector/

Das Gute funktioniert:

$( "select" ).on('change',function() {
  var str = "";
  // For multiple choice
  $( "select option:selected" ).each(function() {
    str += $( this ).val() + " "; 
  });
});

und

$( "select" ).on('change',function() {
  // For unique choice
  var selVal = $( "select option:selected" ).val(); 
});

und sei einfach für eine einzigartige Wahl

var SelVal = $( "#idSelect option:selected" ).val();
0
alex Roosso