jQuery的:设置select列表“select”基于文本,失败奇怪

我一直在使用下面的代码(使用jQuery v1.4.2)根据“文本”描述而不是“值”来设置select列表的“selected”属性:

$("#my-Select option[text=" + myText +"]").attr("selected","selected") ; 

这段代码工作正常,直到我注意到一个select列表失败,取决于被匹配的文本。 经过一番拉毛之后,我意识到只有在文本是一个单词(没有空格,没有非字母字符)的情况下才会失败。 (我之前使用的这个代码在单个多字化学名称组成的select列表中工作得很好。)

例如,在一个select列表中,它工作正常:
哌酸
25-d-spirosta -3,5-二烯
pogostol(#Pogostemon#)

它失败了:
葡萄糖
腺嘌呤

我试过任何我能想到的用引号括起来的文本variables(无论是单引号还是双引号)都无济于事。 (但是,为什么一个单词需要引用时,两个单词短语呢?)

我已经努力在那里编码文本,并有相同的结果。

这工作:

 $("#constituent option[text=#a#-allocryptopine]").attr('selected', 'selected'); 

这工作:

 $("#constituent option[text=5-O-methylrisanrinol]").attr('selected', 'selected'); 

不起作用

 $("#constituent option[text=adenine]").attr('selected', 'selected'); 

我试图用硬编码引号。 这不起作用

 $("#constituent option[text='glucose']").attr('selected', 'selected'); 

我无法得到硬编码的引号(单或双)来处理任何文本。

值得注意的是,当使用“值”属性时,引号是可以接受的。 例如,这两个工作正常:

 $("#constituent option[value='3']").attr('selected', 'selected'); $("#constituent option[value=3]").attr('selected', 'selected'); 

下面是一些代码来演示这个问题。 两个select列表,其中第一个是简单的单词,两个单词短语中的第二个。 加载页面时尝试设置每个select列表的值。 jQuery代码适用于第二个列表,但不是第一个。 (我试图把一个空间放在“猴子”上来得到“mon key”,它起作用了!)

下面的代码的工作演示在这里 。

对于我在这里做错了什么,我将不胜感激。 甚至可以使用“文本”属性的替代select器语法。 在此先感谢所有有时间帮助的人。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <script type="text/javascript" src="../js/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ var text1 = 'Monkey'; $("#mySelect1 option[text=" + text1 + "]").attr('selected', 'selected'); var text2 = 'Mushroom pie'; $("#mySelect2 option[text=" + text2 + "]").attr('selected', 'selected'); }); </script> </head> <body> <select id="mySelect1"> <option></option> <option>Banana</option> <option>Monkey</option> <option>Fritter</option> </select> <select id="mySelect2"> <option></option> <option>Cream cheese</option> <option>Mushroom pie</option> <option>French toast</option> </select> </body> </html> 

当一个<option>没有value="" ,文本变成了它的value ,所以你可以在<select>上使用.val()来设置值,如下所示:

 var text1 = 'Monkey'; $("#mySelect1").val(text1); var text2 = 'Mushroom pie'; $("#mySelect2").val(text2); 

你可以在这里testing它 ,如果这个例子不是你正在做的事情,而且它们实际上有一个值,那么使用<option>元素的.text属性到.filter() ,就像这样:

 var text1 = 'Monkey'; $("#mySelect1 option").filter(function() { return this.text == text1; }).attr('selected', true); var text2 = 'Mushroom pie'; $("#mySelect2 option").filter(function() { return this.text == text2; }).attr('selected', true);​ 

你可以在这里testing这个版本 。

尝试这个:

 $("#mySelect1").find("option[text=" + text1 + "]").attr("selected", true); 

$("#my-Select option:contains(" + myText +")").attr("selected", true);

这将返回包含您的文本描述的第一个选项。

使用filter()函数似乎可以在testing用例中工作(在Firefox中testing)。 select器将如下所示:

 $('#mySelect1 option').filter(function () { return $(this).text() === 'Banana'; }); 

如果有人谷歌为此,上述解决scheme不适合我,所以我结束使用“纯”的JavaScript

 document.getElementById("The id of the element").value = "The value" 

这将设置值,并在combobox中select当前值。 在Firefoxtesting。

这比继续searchjQuery的解决scheme更容易

下面的文字条目有和没有空格:

 $("#mySelect1").find("option[text=" + text1 + "]").attr("selected", true); 

我们可以通过在下拉列表的选项中search文本,然后将select的属性设置为true来完成。

此代码在每个环境中运行。

  $("#numbers option:contains(" + inputText + ")").attr('selected', 'selected'); 

$('#my-Select option')。each(function(){

  if ($(this).text() == roll) $(this).attr('selected', 'selected'); else $(this).removeAttr('selected'); }); 
 setSelectedByText:function(eID,text) { var ele=document.getElementById(eID); for(var ii=0; ii<ele.length; ii++) if(ele.options[ii].text==text) { //Found! ele.options[ii].selected=true; return true; } return false; }, 

我尝试了一些这些东西,直到我有一个在Firefox和IE工作。 这是我想出来的。

 $("#my-Select").val($("#my-Select" + " option").filter(function() { return this.text == myText }).val()); 

另一种更可读的方式来写它:

 var valofText = $("#my-Select" + " option").filter(function() { return this.text == myText }).val(); $(ElementID).val(valofText); 

伪代码:

 $("#my-Select").val( getValOfText( myText ) );