阅读选择=多个不工作答案

【问题标题】：Read select=multiple not working阅读选择=多个不工作
【发布时间】：2014-11-03 14:53:49
【问题描述】：

我有一个多选选项，如下所示；

<select name="cars" id="carsId" multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
<input type="submit" onclick="readValues()">

我需要将所有值读入 readValues 函数的数组中。数组应该是这样的

A = [Volvo,Saab,opel,audi]

请帮帮我！！

【问题讨论】：

stackoverflow.com/questions/5330030/… 的可能重复项
@Exlord 我查过了，这是另一个案例！！
您的意思是所有选项，而不仅仅是选择一次还是仅选择一次？
@Exlord 我需要将该字段中的所有值放入一个数组中。希望你明白了！
@Exlord 链接到的问题应该告诉你所有你需要知道的。不要创建字符串，只需将值添加到数组中即可。

标签： javascript

【解决方案1】：

你也可以试试这个：

var readValues = function () {
    var options = document.getElementById('carsId').options;
    var list = [],
        i = options.length;
    while (i--) {
        list.push(options[i].value);
    }
    console.log(list);//<-- ["audi", "opel", "saab", "volvo"] 
};

如果您需要向用户显示的文本，请使用list.push(options[i].innerHTML);

【讨论】：

【解决方案2】：

http://www.w3schools.com/jsref/coll_select_options.asp

var x = document.getElementById("mySelect");
var options = [];
for (var i = 0; i < x.length; i++)
  {
     options.push(x.options[i].value);// or .text for the text
  }

使用 jquery ： How to get all options of a select using jQuery?

 var options = [];
$("#id option").each(function()
{
    options.push($(this).val());
});

【讨论】：

【解决方案3】：

你可以试试这个：

如果您使用的是 jQuery，可以尝试以下操作

jQuery 解决方案

function readValuesJQuery(){
    var A = $("select option").map(function(){
        return this.value;
    }).get();
    console.log(A);
}

或

javascript 解决方案

function readValuesJavascript(){
   var ddlArray= new Array();
   var ddl = document.getElementsByTagName('select')[0];
   for (i = 0; i < ddl.options.length; i++) {
      ddlArray[i] = ddl .options[i].value;
   }
   console.log(ddlArray);
}

Demo

【讨论】：

@downvoter 最好提及投反对票的原因！

【解决方案4】：

使用 jQuery：

function readValues() {
    var values = [];
    $('[name="cars"] option').each(function() {
        values.push($(this).val());
    });
    return values;
}

使用纯javascript：

var readValues = function () {
    var options = document.getElementById('carsId').children;
    var values = [];
    for(i = 0; i < options.length; ++i) {
        values.push(options[i].value);
    }
    console.log(values);
    return values;
}

演示：http://jsfiddle.net/q94ndrcc/

【讨论】：

这里没有标记jQuery！
@fish_ball 它只返回选定的值。我都需要！

【解决方案5】：

click here

$("#sel").click(function(e) { // when link clicked
    e.preventDefault();
    $("#foo option:selected ").each(function() {
        var v = $(this).attr("value"); // first select's value
        $('#bar option').each(function() {
            if ($(this).attr("value") == v) { 
                $(this).attr("selected",true); // select if same value
            }
        });
    });
})

【讨论】：

【解决方案6】：

尝试跟随它的工作。

HTML

<select name="cars" id="carsId" multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
<input type="button" id="btnClick" value="getValue">

脚本：jQuery 1.9.1

//1. for selected value:
$(document).ready(function(){
      $('#btnClick').click(function(){
         var selText = [];
         $("#carsId option:selected").each(function () {
           var $this = $(this);
           if ($this.length) {
            selText.push($this.text());
           }
        });
          alert(selText);
    });
});

//2. get all value without any selection:

 $(document).ready(function(){
      $('#btnClick').click(function(){
         var selText = [];
         $("#carsId option").each(function () {
           var $this = $(this);
           if ($this.length) {
            selText.push($this.text());
           }
        });
          alert(selText);
      });
  });

Running Demo

【讨论】：