如何获得一个选择使用jQuery的所有选项？

Question

我

如何能获得通过jQuery的一个选择的所有选项通过将其ID？

我只希望得到他们的价值观，而不是文字。

Answer 1

使用：

$("#id option").each(function()
{
    // Add $(this).val() to your list
});

。每个（）| jQuery的API文档

Answer 2

我不知道的jQuery，但我知道，如果你选择的元素，它包含了一个“选择”的对象。

var myOpts = document.getElementById('yourselect').options;
alert(myOpts[0].value) //=> Value of the first option

Answer 3

$.map可能是做到这一点的最有效方法。

var options = $('#selectBox option');

var values = $.map(options ,function(option) {
    return option.value;
});

您可以添加更改选项以$('#selectBox option:selected')如果只想所选择的人。

第一行选择所有的复选框的并把它们的jQuery元件到变量中。然后，我们使用jQuery的.map功能的功能应用到每个变量的要素;我们所做的就是返回每个元素作为的价值是我们所关心的。因为我们正在返回他们在地图函数内它实际上构建正如所要求的值的数组。

Answer 4

某些答案使用each，但map是一个更好的选择这里IMHO：

$("select#example option").map(function() {return $(this).val();}).get();

有（至少）在jQuery的2种map功能。托马斯·彼得森的答案使用“工具/ jQuery.map”;此答案使用“移动/地图”（并因此有点更干净的代码）。

这要看你要去的价值观做什么。如果是你，让我们说，想从一个函数返回值，map可能是更好的选择。但是，如果你要使用的值直接，你可能想each。

Answer 5

$('select#id').find('option').each(function() {
    alert($(this).val());
});

Answer 6

$("#id option").each(function()
{
    $(this).prop('selected', true);
});

虽然，在 CORRECT 的方法是设置在元件的DOM属性，像这样：

$("#id option").each(function(){
    $(this).attr('selected', true);
});

Answer 7

这将使 #myselectbox 的选项值到一个干净的数组你：

// First, get the elements into a list
var domelts = $('#myselectbox option');

// Next, translate that into an array of just the values
var values = $.map(domelts, function(elt, i) { return $(elt).val();});

Answer 8

可以通过复选框的名称采取所有的“选择的值”，并在由分开的刺呈现它们“”

一个很好的办法做到这一点是使用jQuery的$ .MAP（）：

var selected_val = $.map($("input[name='d_name']:checked"), function(a)
    {
        return a.value;
    }).join(',');

alert(selected_val);

Answer 9

工作实施例

在最有效的方式来做到这一点是利用$.map()

示例：

var values = $.map($('#selectBox option'), function(ele) {
   return ele.value; 
});

Answer 10

可以使用以下为该代码：

var assignedRoleId = new Array();
$('#RolesListAssigned option').each(function(){
    assignedRoleId.push(this.value);
});

Answer 11

有关多选选项：

$('#test').val()返回选定的值的列表。 $('#test option').length返回的选项总数（两者选择和未选择）

Answer 12

这是与jQuery一个简单的脚本：

var items = $("#IDSELECT > option").map(function() {
    var opt = {};
    opt[$(this).val()] = $(this).text();
    return opt;
}).get();
var selectvalues = [];

for(var i = 0; i < items.length; i++) {
    for(key in items[i]) {


        var id = key;
        var text = items[i][key];

        item = {}
        item ["id"] = id;
        item ["text"] = text;

        selectvalues.push(item);

    }
}
console.log(selectvalues);
copy(selectvalues);

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

Answer 13

下面是在jquery的一个简单的例子来获得所有的值，文本，或所选择的项目的值，或者所选择的项目的文本

$('#nCS1 > option').each((index, obj) => {
   console.log($(obj).val());
})

printOptionValues = () => {

  $('#nCS1 > option').each((index, obj) => {
    console.log($(obj).val());
  })

}

printOptionTexts = () => {
  $('#nCS1 > option').each((index, obj) => {
    console.log($(obj).text());
  })
}

printSelectedItemText = () => {
  console.log($('#nCS1 option:selected').text());
}

printSelectedItemValue = () => {
  console.log($('#nCS1 option:selected').val());
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select size="1" id="nCS1" name="nCS1" class="form-control" >
					<option value="22">Australia</option>
          <option value="23">Brunei</option>
          <option value="33">Cambodia</option>
          <option value="32">Canada</option>
          <option value="27">Dubai</option>
          <option value="28">Indonesia</option>
          <option value="25">Malaysia</option>				
</select>
<br/>
<input type='button' onclick='printOptionValues()' value='print option values' />
<br/>
<input type='button' onclick='printOptionTexts()' value='print option texts' />
<br/>
<input type='button' onclick='printSelectedItemText()' value='print selected option text'/>
<br/>
<input type='button' onclick='printSelectedItemValue()' value='print selected option value' />