我很难过。我有一个带下拉列表的表单,我想获取列表中所有值的列表。我从w3学校中提取了以下示例(是的,我知道它不可靠,但堆栈溢出的其他解决方案似乎与此非常相似)。它不适合我,我尝试将其插入jsfiddle,但没有运气。
HTML:
<form>Select your favorite fruit:
<select id="mySelect">
<option value="a">Apple</option>
<option value="o">Orange</option>
<option value="p">Pineapple</option>
<option value="b">Banana</option>
</select>
</form>
<button type="button" onclick="displayResult()">Display text of all options</button>
的javascript:
function displayResult() {
var x = document.getElementById("mySelect");
var txt = "All options: ";
var i;
for (i = 0; i < x.length; i++) {
txt = txt + "\n" + x.options[i].value;
}
alert(txt);
}
不使用jsfiddle:http://jsfiddle.net/WfBRr/1/
但是,它适用于他们的网站: http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_option_text2
关于如何解决这个问题的任何想法?
答案 0 :(得分:25)
你有两个问题:
1)您包含HTML的顺序。尝试在小提琴的JavaScript设置中将下拉列表从“onLoad”更改为“no wrap - head”。
2)您的函数打印值。你真正追求的是文本
x.options[i].text;
代替x.options[i].value
;
答案 1 :(得分:6)
变化:
x.length
为:
x.options.length
链接到fiddle
我同意亚伯拉罕的意见 - 您可能希望使用text
代替value
<强>更新强>
你的小提琴不起作用的原因是因为你选择了选项:&#34; onLoad&#34;而不是:&#34;没有包装&#34;
答案 2 :(得分:1)
根据DOM结构,您可以使用以下代码:
var x = document.getElementById('mySelect');
var txt = "";
var val = "";
for (var i = 0; i < x.length; i++) {
txt +=x[i].text + ",";
val +=x[i].value + ",";
}
答案 3 :(得分:1)
示例:
<select name="sel1" id="sel1">
<option value="001">option 001</option>
<option value="002">option 002</option>
<option value="003">option 003</option>
<option value="004">option 004</option>
</select>
值:
let selectElement = document.querySelectorAll('[name=sel1]');
let optionValues = [...selectElement[0].options].map(o => o.value)
选项文本
let selectElement = document.querySelectorAll('[name=sel1]');
let optionNames = [...selectElement[0].options].map(o => o.text)
答案 4 :(得分:0)
将click事件直接放在按钮上似乎会导致问题。由于某种原因,它无法找到该功能。不知道为什么......
如果您在javascript中附加事件处理程序,它确实可以正常工作。
请在此处查看:http://jsfiddle.net/WfBRr/7/
<button id="display-text" type="button">Display text of all options</button>
document.getElementById('display-text').onclick = function () {
var x = document.getElementById("mySelect");
var txt = "All options: ";
var i;
for (i = 0; i < x.length; i++) {
txt = txt + "\n" + x.options[i].value;
}
alert(txt);
}