web-dev-qa-db-ja.com

jQuery select2はselectタグの値を取得しますか？

こんにちは友人、これは私のコードです：

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

これは私のselect2コードです：

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

以下は、選択した値を取得するためのコードです。

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

これはfirst,second,threeのようなテキストを返すので、1,2,3を取得したいです。
手段ではなく、テキストではなく、選択ボックスの値が必要です。

jqueryjquery-select2
83
Renish Khunt
$("#first").val(); // this will give you value of selected element. i.e. 1,2,3.
119
somesh

Select要素を取得するには、$('#first').val();を使用できます

選択した値のテキストを取得するには-$('#first :selected').text();

select2()関数コードを投稿してください

48
Krish R

$("#first").select2('data')はすべてのデータをマップとして返​​します

33
wawa

ajaxを使用している場合の場合、選択直後にselectの更新値を取得できます。

//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)
});

クレジット：Steven-Johnston

7
Johny Pie

このソリューションでは、select要素を忘れることができます。 select要素にIDがない場合に役立ちます。

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

簡単な答えは：

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

そして、この方法でも書くことができます：

 $('#first').val()
2
Rajiv Sharma

これを試して ：

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

this fiddle を参照してください。
基本的に、value- tagsのoptionsを取得しますが、常に$("#first").val()を使用してselect- nodeの値を取得しようとします。

そのため、オプションタグを選択する必要があり、jQueryセレクターを利用します。

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

$("#first option")は、ID optionを持つ要素の子であるすべてのfirstを選択します。

2
Basti M

他の答えは私のために働いていなかったので、私はソリューションを開発しました：

Class = "option-item"で簡単にターゲティングするオプションを作成しました

HTML：

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

次に、選択したすべてのオプションに対して、iを追加しましたdisplay noneプロパティ

CSS：

option:checked {
   display: none;
}

SelectBoxにchangeを追加して、シンプル：hidden属性

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();
});

作業フィドル： https://jsfiddle.net/Friiz/2dk4003j/10/

0
Bartosz Was

解決策：

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