提问人：Teifion 提问时间：8/8/2008 最后编辑：Rais AlamTeifion 更新时间：4/13/2023 访问量：258935
从下拉框中获取文本
Getting the text from a drop-down box
问：
这将获取在我的下拉菜单中选择的任何内容的值。
document.getElementById('newSkill').value
但是，我无法确定下拉菜单当前显示的文本要追求的属性。我尝试了“文本”，然后查看了 W3Schools，但没有答案，这里有人知道吗？
对于那些不确定的人，这里有一个下拉框的 HTML。
<select name="newSkill" id="newSkill">
<option value="1">A skill</option>
<option value="2">Another skill</option>
<option value="3">Yet another skill</option>
</select>
答：
1赞
Brian Childress
8/8/2008
#1
这能得到正确的答案吗？
document.getElementById("newSkill").innerHTML
评论
5赞
Valentin Despa
11/29/2011
这将返回选项的完整 HTML 代码。比如 ' <option value=“1”>A skill</option> <option value=“2”>Another skill</option> <option value=“3”>Yet another skill</option> '
6赞
Thejesh GN
8/8/2008
#2
document.getElementById('newSkill').options[document.getElementById('newSkill').selectedIndex].value
应该有效
评论
4赞
ninjaPixel
10/30/2013
OP 需要 .text 属性，而不是 .value
9赞
Tanerax
8/8/2008
#3
这应该返回所选值的文本值
var vSkill = document.getElementById('newSkill');
var vSkillText = vSkill.options[vSkill.selectedIndex].innerHTML;
alert(vSkillText);
道具：@Tanerax用于阅读问题，知道问题的内容并在其他人弄清楚之前回答问题。
编辑：DownModed，因为我实际上完全阅读了一个问题，并回答了它，这是一个可悲的世界。
152赞
Patrick McElhaney
8/8/2008
#4
根据示例 HTML 代码，以下是获取当前所选选项的显示文本的一种方法：
var skillsSelect = document.getElementById("newSkill");
var selectedText = skillsSelect.options[skillsSelect.selectedIndex].text;
评论
4赞
Teifion
9/19/2008
对于那些迟到的人，有几个建议，但没有人注意到他们说了 .value，他们应该说 .text，这对我们所有人来说都是令人困惑的一天。
4赞
Lilith
2/3/2013
#5
这有效，我自己尝试过，我想我把它贴在这里，以防有人需要它......
document.getElementById("newSkill").options[document.getElementById('newSkill').selectedIndex].text;
0赞
raton
5/13/2014
#6
var ele = document.getElementById('newSkill')
ele.onchange = function(){
var length = ele.children.length
for(var i=0; i<length;i++){
if(ele.children[i].selected){alert(ele.children[i].text)};
}
}
2赞
shekh danishuesn
10/1/2015
#7
将更改事件附加到 select，该事件获取每个选定选项的文本并将它们写入 div。
你可以使用jQuery，它非常有面子，成功且易于使用
<select name="sweets" multiple="multiple">
<option>Chocolate</option>
<option>Candy</option>
<option>Taffy</option>
<option selected="selected">Caramel</option>
<option>Fudge</option>
<option>Cookie</option>
</select>
<div></div>
$("select").change(function () {
var str = "";
$("select option:selected").each(function() {
str += $( this ).text() + " ";
});
$( "div" ).text( str );
}).change();
0赞
Debanjan Roy
2/1/2016
#8
var selectoption = document.getElementById("dropdown");
var optionText = selectoption.options[selectoption.selectedIndex].text;
评论
0赞
Stephan Kristyn
2/11/2016
一些文字来解释发生了什么怎么样？
0赞
Ferrybig
2/11/2016
虽然仅代码答案可以解决操作的问题，但不建议这样做，因为它对未来的访问者没有价值，仅提供的答案很快就会被标记为“质量非常低”，结果它将很快被删除。编辑您的答案以包含所提供代码的作用的解释。
0赞
Debanjan Roy
7/20/2016
谢谢。我希望我的答案很容易被其他人理解。
0赞
Chris22
8/9/2017
当我尝试记录它时，只返回第一个选项项。我希望它们中的每一个都从事件中显示出来。var optionText = selectoption.options[selectoption.selectedIndex].text;onchange
0赞
IbrahimSediq
3/29/2016
#9
请尝试以下方法，这是最简单的方法，并且效果很好
var newSkill_Text = document.getElementById("newSkill")[document.getElementById("newSkill").selectedIndex];
23赞
BOBIN JOSEPH
5/23/2017
#10
简单地说，您可以使用jQuery而不是JavaScript
$("#yourdropdownid option:selected").text();
试试这个。
评论
3赞
cazort
4/3/2019
原来的问题没有提到 JQuery。我们这些不使用 JQuery 的人通常更希望答案不要引用它，除非问题引用或标记它。当有一个相对简洁的解决方案时，情况尤其如此，比如 Patrick McElhaney 给出的解决方案。
2赞
Broken Man
10/28/2019
@cazort 恰恰相反。我需要知道如何用 JQuery 做到这一点，这个答案为我提供了我需要知道的东西，因此 Bobin Joseph 将其作为答案非常有用（也很好）。
0赞
JCIsola
4/16/2021
@cazort帕特里克的答案是13岁的男人
0赞
cazort
4/19/2021
@JCIsola我不在乎帕特里克的答案有多老，我关心它是否在没有额外软件包的情况下工作。它适用于所有现代浏览器，如果有的话，现在更好，因为代码不起作用的旧浏览器（例如不支持 getElementById（））早已退役，而在编写答案时，一些这样的浏览器仍在使用。除了问题中指定的包之外，它不需要额外的包。
2赞
Muhammad Tariq Ahmed Khan
10/25/2017
#11
function getValue(obj)
{
// it will return the selected text
// obj variable will contain the object of check box
var text = obj.options[obj.selectedIndex].innerHTML ;
}
HTML 代码段
<asp:DropDownList ID="ddl" runat="server" CssClass="ComboXXX"
onchange="getValue(this)">
</asp:DropDownList>
2赞
Manpreet Singh Dhillon
2/14/2019
#12
这是一个简单而简短的方法
document.getElementById('elementID').selectedOptions[0].innerHTML
0赞
RayH
6/3/2021
#13
发现这是一个棘手的问题，但使用这里的想法，我最终得到了使用PHP和Mysqli填充列表的解决方案：然后是一些javascript来获取工作变量。
<select id="mfrbtn" onchange="changemfr()" >
<option selected="selected">Choose one</option>
<?php
foreach($rows as $row)
{
echo '<option value=implode($rows)>'.$row["Mfrname"].'</option>';
}
?>
</select>
然后：
<script language="JavaScript">
function changemfr()
{
var $mfr2=document.getElementById("mfrbtn").selectedOptions[0].text;
alert($mfr2);
}
</script>
1赞
Fahad Mughal
4/13/2023
#14
使用 jQuery 获取下拉列表的选定文本。我在 MVC 中使用了它......
$('#dropdownId :selected').text()
评论