Question

有谁知道如何通过javascript从<option>获取所有值？

示例：

<select name="test" id="test">
  <option value="1">one</option>
  <option value="2">two</option>
  <option value="3">three</option>
</select>

如何使用javascript从<option>检索所有值并输出：

1
2
3

Answer 1

饼：

var opts = document.getElementById('test').options;
var vals = [];
for(var i = 0, j = opts.length; i < j; i++) 
   vals.push(opts[i].value);

Answer 2

您可以使用Array.prototype.map代替显式循环。

var options = document.getElementById('test').options;

var values = Array.prototype.map.call(options, function(val) {
    return val.value;
});

如果您支持较旧的浏览器，则需要将其添加到Array.prototype。

您可以使用MDC实施：

https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/map

if (!Array.prototype.map)
{
  Array.prototype.map = function(fun /*, thisp */)
  {
    "use strict";

    if (this === void 0 || this === null)
      throw new TypeError();

    var t = Object(this);
    var len = t.length >>> 0;
    if (typeof fun !== "function")
      throw new TypeError();

    var res = new Array(len);
    var thisp = arguments[1];
    for (var i = 0; i < len; i++)
    {
      if (i in t)
        res[i] = fun.call(thisp, t[i], i, t);
    }

    return res;
  };
}

Answer 3

var options = document.getElementById('test').options;

请参阅https://developer.mozilla.org/en/DOM/HTMLOptionsCollection

编辑：为了完整性

var options = document.getElementById('test').options;
var values = [];
for (var i = 0; i < options.length; i++) {
    var option = options.item(i);
    var value = option.value || option.text; // For IE
    values.push(value);
}

如果未设置value属性，则从内存中，某些版本的Internet Explorer不会返回value属性的选项文本内容。

Answer 4

你可以用这样的

这样做

var opt = document.getElementById('idOfYourSelect').options;

for (var i = 0, ii = opt.length; i < ii; i++) {
    console.log(opt[i].value);
}

如果您使用jQuery，它可以像这样

var opt = $('#idOfYourSelect options');

for (var i = 0, ii = opt.length; i < ii; i++) {
    console.log(opt[i].value);
}

Answer 5

我建议使用这个jQuery库＆amp;使用.each（）方法查询定义的“select”下的所有“options”标签。

Answer 6

我想要所有的值及其标签，所以我在代码

下面使用

var opts = document.getElementById('state_of_birth').options;
var vals = [];
var txt = [];
for(i=0,j=opts.length;i<j;i++) 
{
    vals.push(opts[i].value);
    txt.push(opts[i].text);
}
var k=i;
for(i=0;i<k;i++)
{
    window.alert(vals[i]);
    window.alert(txt[i]);
}

使用javascript </option>从<option>获取值

6 个答案: