104

你好朋友这是我的代码：

<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。
意味着我需要选择框的值，而不是文本。

4

12 回答 12

169 
$("#first").val(); // this will give you value of selected element. i.e. 1,2,3.
于 2013-11-11T14:17:12.160 回答
65

要获取 Select 元素，您可以使用$('#first').val();

要获取所选值的文本 -$('#first :selected').text();

能否请您发布您的select2()功能代码

于 2013-11-11T14:07:11.307 回答
39

$("#first").select2('data')将所有数据作为地图返回

于 2016-01-11T07:53:05.267 回答
13

如果您使用的是 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)
});

学分：史蒂文-约翰斯顿

于 2016-09-05T20:20:07.993 回答
9

此解决方案允许您忘记选择元素。当您在选择元素上没有 id 时很有帮助。

$("#first").select2()
.on("select2:select", function (e) {
    var selected_element = $(e.currentTarget);
    var select_val = selected_element.val();
});
于 2016-09-02T16:07:49.273 回答
6

简单的答案是：

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

你也可以这样写：

 $('#first').val()
于 2017-11-23T09:18:32.300 回答
4

尝试这个 ：

$('#input_id :selected').val(); //for getting value from selected option
$('#input_id :selected').text(); //for getting text from selected option
于 2017-09-04T08:52:08.660 回答
3

以上解决方案不适用于我最新的 select2 (4.0.13)

使用 jQuery，您可以使用此解决方案根据文档检索值：https ://select2.org/programmatic-control/retrieving-selections

$('#first').find(':selected').val();
于 2020-02-25T14:35:49.340 回答
2

看到这个小提琴。
基本上，您想获取 -tags 的values option，但您总是尝试使用 获取select-node的值$("#first").val()。

所以我们必须选择选项标签，我们将使用 jQuerys 选择器：

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

$("#first option")选择每个optionid 元素的子元素first。

于 2013-11-11T14:16:27.667 回答
2 
$(".element").select2(/*Your code*/)
.on('change', function (e) {
     var getID = $(this).select2('data');
     alert(getID[0]['id']); // That's the selected ID :)
});
于 2021-02-12T16:56:14.153 回答
0

其他答案对我不起作用，所以我开发了解决方案：

我使用 class= "option-item"创建了选项以便于定位

HTML： 

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

然后对于每个选定的选项，我添加了display none属性

CSS： 

option:checked {
   display: none;
}

现在我们可以添加更改到我们的 SelectBox 以通过简单的:hidden属性找到我们选择的具有无显示属性的选项

查询： 

$('#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/

于 2018-04-04T17:44:56.547 回答
0

解决方案 ：

var my_veriable = $('#your_select2_id').select2().val();
var my_last_veriable = my_veriable.toString();
于 2018-10-17T23:38:41.063 回答