2008-10-27 73 views
14

如果我有以下選擇,並且不知道用於選擇項目的值,如question或我想要選擇的項目的索引,我如何選擇jQuery選項之一知道像選項C的文本值?如何使用jQuery在下拉菜單中通過文本值選擇項目?

<select id='list'> 
<option value='45'>Option A</option> 
<option value='23'>Option B</option> 
<option value='17'>Option C</option> 
</select> 
+0

heh - 我以爲/這看起來很熟悉! – nickf 2008-10-28 00:37:42

回答

14
var option; 
$('#list option').each(function() { 
    if($(this).text() == 'Option C') { 
     option = this; 
     return false; 
    } 
}); 
+1

這是一個新手問題,我確定,但是設置選項是什麼= this;在上面的代碼中做? – 2011-08-15 19:19:46

+1

@Carvell,`option`在第一行實例化,在外部範圍內,但它的值是'undefined`。通過在第4行設置`option`,外部範圍中的`option`現在是其文本值爲`'Option C'`的DOM元素。在`.each`循環之後,在外部作用域中,`option`可以用來引用那個特定的元素。 – eyelidlessness 2011-08-15 23:30:15

+0

啊好的。這就說得通了。我認爲這應該是在我失蹤的每一個功能中做一些事情。設置外部範圍使用我明白:)謝謝。 – 2011-08-16 12:55:05

14

這應該做的伎倆:

// option text to search for 
var optText = "Option B"; 
// find option value that corresponds 
var optVal = $("#list option:contains('"+optText+"')").attr('value'); 
// select the option value 
$("#list").val(optVal) 

由於eyelidlessness指出,正在搜索可以在多個選項中找到的文本時,這將行爲異常。

4
function SelectItemInDropDownList(itemToFind){  
     var option; 
     $('#list option').each(function(){ 
      if($(this).text() == itemToFind) { 
       option = this; 
       option.selected = true; 
       return false;  
       } 
      }); } 

我只修改了前面的代碼,因爲它只在選擇列表中找到選項,有些可能需要文字演示。

9
$("#list option").each(function() { 
    this.selected = $(this).text() == "Option C"; 
}); 
相關問題