JQuery检索文本而不是选择列表的值

时间:2012-04-19 10:20:44

标签: javascript jquery

我需要从选择列表中获取值,但JQuery在select的选项中返回文本。

我有以下简单的代码。

<select id="myselect">
   <option selected="selected">All</option>
   <option value="1">One</option>
   <option value="2">Two</option>
</select>

然后我使用以下JQuery,我认为它会给我带来值

var myOption = $('#myselect').val()

但是当我查看myOption时,我会收到“一个”或“两个”的文字?

5 个答案:

答案 0 :(得分:11)

更新:添加val()。

console.log($('#myselect').val());

// all option's value
$('#myselect').find('option').each(function(){
    console.log($(this).text());
    console.log($(this).val());
});

// change event
$('#myselect').change(function(){
    console.log($(this).find(':selected').text());
    console.log($(this).find(':selected').val());
});

演示:http://jsfiddle.net/yLj4k/3/

答案 1 :(得分:3)

我遇到了这个问题,因为jQuery Val()函数在我脑海中,我实际上将选项定义为<option val='xx'>而不是<option value='xx'>。这就是导致问题的原因。请参阅此更新jsfiddle

<select id="myselect">
   <option value="1">One</option>
   <option value="2">Two</option>
</select>

<select id="myselect2">
   <option val="1">One</option>
   <option val="2">Two</option>
</select>

<script>
$('select').change(function() {
    alert($(this).val());
});
</script>

第一个select将提醒“1”或“2”,第二个select将提醒“一个”或“两个”。

答案 2 :(得分:2)

获取文本值最简单的方法是

对于选定的选项文字:

$("#myselect option:selected").text(); 

对于选定的选项值:

$("select#myselect").val(); 

答案 3 :(得分:0)

修改

Hiya

在这里进行演示:使用文字http://jsfiddle.net/QtjTq/3/&amp;&amp;在这里使用val http://jsfiddle.net/QtjTq/4/

这样访问text() - var myOption = $('#myselect option:selected').text() 用于访问价值 - var myOption = $('#myselect option:selected').val()

详细说明:

for value 如果您想访问value=属性,请使用.val();

for text 如果您想获取文字,例如one or two,请将选定的选项... option:selected.text() api一起使用。

如果您想阅读http://forum.jquery.com/topic/jquery-using-val-vs-text

,请继续

希望这有助于:)欢呼

var myOption = $('#myselect option:selected').text() //**or whatever suit you** 
var myOption = $('#myselect option:selected').val()


<select id="myselect">
   <option value="1">One</option>
   <option value="2">Two</option>
</select>

答案 4 :(得分:0)

Demo

$("#myselect").change(function() {
    alert(this.options[this.selectedIndex].value);
});