jQuery select2 get value of select tag?

Witajcie przyjaciele, to jest mój kod:

<select id='first'>
  <option value='1'> First  </option>
  <option value='2'> Second </option>
  <option value='3'> Three  </option>
</select>

To jest mój kod select2:

$("#first").select2();

Poniżej znajduje się kod do uzyskania wybranej wartości.

$("#first").select2('val'); // It returns first,second,three.

To jest zwracanie tekstu takiego jak first,second,threei chcę otrzymać 1,2,3.
Oznacza, że ​​potrzebuję wartości pola wyboru, a nie tekstu.

$("#first").val(); // this will give you value of selected element. i.e. 1,2,3.

Aby uzyskać element Select, możesz użyć $('#first').val();

Aby uzyskać tekst o wybranej wartości - $('#first :selected').text();

Czy możesz opublikować swój select2()kod funkcji

$("#first").select2('data') zwróci wszystkie dane jako mapę

Jeśli używasz Ajax , możesz chcieć uzyskać zaktualizowaną wartość select zaraz po dokonaniu wyboru.

//Part 1

$(".element").select2(/*Your code*/)    

//Part 2 - continued 

$(".element").on("select2:select", function (e) { 
  var select_val = $(e.currentTarget).val();
  console.log(select_val)
});

Kredyty: Steven-Johnston

Takie rozwiązanie pozwala zapomnieć o wybranym elemencie. Przydatne, gdy nie masz identyfikatora wybranych elementów.

$("#first").select2()
.on("select2:select", function (e) {
    var selected_element = $(e.currentTarget);
    var select_val = selected_element.val();
});

Prosta odpowiedź brzmi:

$('#first').select2().val()

iw ten sposób możesz napisać również:

 $('#first').val()

Spróbuj tego :

$('#input_id :selected').val(); //for getting value from selected option
$('#input_id :selected').text(); //for getting text from selected option

Zobacz to skrzypce .
Zasadniczo chcesz uzyskać values swoich option-tagów, ale zawsze próbujesz uzyskać wartość swojego select-node za pomocą $("#first").val().

Musimy więc wybrać tagi opcji i użyjemy selektorów jQuerys:

$("#first option").each(function() {
    console.log($(this).val());
});

$("#first option")wybiera wszystko, optionco jest dzieckiem elementu o identyfikatorze first.

Powyższe rozwiązania nie działały u mnie z najnowszym select2 (4.0.13)

Dzięki jQuery możesz użyć tego rozwiązania do pobierania wartości zgodnie z dokumentacją: https://select2.org/programmatic-control/retrieving-selections

$('#first').find(':selected').val();

Inne odpowiedzi nie działały, więc opracowałem rozwiązanie:

Utworzyłem opcję z class = "option-item", aby ułatwić namierzanie

HTML:

<select id="select-test">
<option value="5-val" id="first-id" class="option-item"> First option </option>
</select>

Następnie dla każdej wybranej opcji dodałem właściwość wyświetlania none

CSS:

option:checked {
   display: none;
}

Teraz możemy dodać zmianę do naszego SelectBox, aby znaleźć naszą wybraną opcję z właściwością display none przez simple : hidden attribute

JQuery:

$('#select-test').change(function(){
//value 
    $('#select-test').find('.option-item:hidden').val();
//id
    $('#select-test').find('.option-item:hidden').attr('id');
//text
    $('#select-test').find('.option-item:hidden').text();
});

Skrzypce robocze: https://jsfiddle.net/Friiz/2dk4003j/10/

Rozwiązanie :

var my_veriable = $('#your_select2_id').select2().val();
var my_last_veriable = my_veriable.toString();