Wie bekomme ich ausgewählten Wert von einem Bootstrap-Select-Drop-down

Question

Ich versuche, den ausgewählten Text, nicht Wert, aus meinem Bootstrap-Dropdown, aber meine .text() -Anweisung gibt eine Zeichenfolge zurück, die alle Werte enthält mit einem '\ n' dazwischen.

Hier ist meine gerenderte HTML

<select class="form-control" id="SpaceAccommodation" name="YogaSpaceAccommodation"> 
    <option selected="selected" value="0">1-4</option> 
    <option value="1">5-9</option> 
    <option value="2">10-15</option> 
    <option value="3">16-20</option> 
    <option value="4">20+</option> 
</select> 

Hier ist mein Javascript, aber SelectedText gibt '5-9 \ n10-15 \ n16-20 \ n20 +' Ich will es 5-9 oder 10 zurückzukehren -15, etc ..

$('#SpaceAccommodation').change(function() { 

    var selectedText = $(this).text(); 
}); 

Answer 1

Sie können den ausgewählten Wert Text mit $(this).find("option:selected").text() erhalten.

$('#SpaceAccommodation').change(function() { 
 
    var selectedText = $(this).find("option:selected").text(); 
 
    
 
    $(".test").text(selectedText); 
 
});

<script src="https://code.jquery.com/jquery-1.6.4.min.js"></script> 
 
<select class="form-control" id="SpaceAccommodation" name="YogaSpaceAccommodation"> 
 
    <option selected="selected" value="0">1-4</option> 
 
    <option value="1">5-9</option> 
 
    <option value="2">10-15</option> 
 
    <option value="3">16-20</option> 
 
    <option value="4">20+</option> 
 
</select> 
 
<div class="test"></div>

Answer 2

Fiddle for you

$(document).ready(function() { 
    $('.chzn-select').change(function() { 
     alert($('.chzn-select option:selected').text()); 
    }); 
}); 

<select id="second" class="chzn-select" style="width: 100px"> 
    <option value="1">one</option> 
    <option value="2">two</option> 
</select> 

auf der css3 psuedo-Klasse Diese basiert :selected. Es ist sehr ähnlich zu :checked, konnte ich nicht finden, Dokumente für :selected

Answer 3

Falls jemand interessiert ist, habe ich eine andere Lösung. Ich habe mir nur die Argumente aus der Dokumentation angesehen. Sie können etwas tun (Vorausgesetzt, dass Sie den Wert-Tag des Optionselement .:

$('#type_dropdown') 
       .on('changed.bs.select', 
        function(e, clickedIndex, newValue, oldValue) { 
         alert(e.target.value); 
        }); 
     }); 

https://silviomoreto.github.io/bootstrap-select/options/