使用jQuery获取所选选项的文本

53

我有一个带有选项值的下拉框。如何获取所选选项的文本,而不是其值?

<select name="options[2]" id="select_2">
    <option value="">-- Please Select --</option>
    <option value="6" price="0">100</option>
    <option value="7" price="0">125</option>
    <option value="8" price="0">150</option>
    <option value="9" price="0">175</option>
    <option value="10" price="0">200</option>
    <option value="3" price="0">25</option>
    <option value="4" price="0">50</option>
    <option value="5" price="0">75</option>
</select>

我尝试了这个:

$j(document).ready(function(){
    $j("select#select_2").change(function(){
        val = $j("select#select_2:selected").text();
        alert(val);
    });
});

但是它返回的是undefined

5个回答

73

关闭,你可以使用

$('#select_2 option:selected').html()

1
$('#select_2 :selected').html() 也可以工作吗? - Jose Faeti
2
记住,$('#select_2').find('option:selected').html()会更有效率 ;)。 - Archangel
@Archangel 出于好奇,这样做会更有效率吗? - Damian
1
@Archangel 公平的说,你的原始评论听起来好像更适用于这个例子,但如果是这样的话,效率上的差别微乎其微,因为它们基本上是做同样的事情。使用.find()可以有所好处(就像我今天早些时候遇到的场景),但根据我的经验,它更多是一种情况性的方法,很少需要使用它,因为通常有更好的方式。 - Damian
1
@Damian 我同意你的观点。实际上,我应该明确指出这通常更有效,但并非总是如此。 - Archangel
显示剩余6条评论

27
$(document).ready(function() {
    $('select#select_2').change(function() {
        var selectedText = $(this).find('option:selected').text();
        alert(selectedText);
    });
});

演示代码


这是最优雅的方法...特别是当你将 select 作为一个对象时。 - MYNE
当您将选择分配给变量时,例如 foo = $('#select2),这是要使用的变体,如下所示:foo.find('option:selected').text() - rbb

13

将您的选择器更改为

val = j$("#select_2 option:selected").text();
你选择的是 <select> 而不是 <option>

4

您可以考虑这个选项。

$('#select_2').find('option:selected').text();

虽然我不确定,但这可能是一个更快的解决方案。


1

你可以将值设置为文本,然后执行

$j(document).ready(function(){
    $j("select#select_2").change(function(){
        val = $j("#select_2 option:selected").html();
        alert(val);
    });
});

或者我在类似情况下所做的是

<select name="options[2]" id="select_2" onChange="JavascriptMethod()">
  with you're options here
</select>

使用第二个选项,您应该会得到一个未定义的结果。 如果它有效,请给我反馈 :)

帕特里克


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接