javascript - jquery - 如何通过文本说明设置选择框的 selected值?

  显示原文与译文双语对照的内容

我有一个选择控件,在一个javascript变量中我有一个文本字符串。

使用 jQuery,我想将选择控件的选中元素设置为带有( 与我没有的价值相反)的文本描述。

我知道用价值设置它很简单。 e.g.


$("#my-select").val(myVal);

但是我通过文字描述做的有点困难。 我想一定有一种方法可以从文本描述中获取值,但是我的大脑是周五的afternoon-ed,无法解决问题。

时间:

给定这里 HTML:


<select>
 <option value="0">One</option>
 <option value="1">Two</option>
</select>

于jQuery相关 v1.6 +, 选择方式 description:


var text1 = 'Two';
$("select option").filter(function() {
//may want to use $.trim in here
 return $(this).text() == text1; 
}).prop('selected', true);

被描述,以及jQuery的版本低于 1.6 选择大于或者等于 1.4: http://stackoverflow.com 3644500/31532


var text1 = 'Two';
$("select option").filter(function() {
//may want to use $.trim in here
 return $(this).text() == text1; 
}).attr('selected', true);

注意,虽然这里方法在 1.6上的版本中工作,但小于 1.9,自 1.6之后已经被否决。 在jQuery中 1.9 +,它 不适.

按说明选择以前版本的

val() 应该处理两种情况。 你没有看到它?

比如:


$('select').val('1');//selects"Two"
$('select').val('Two');//also selects"Two"

为了避免所有jQuery版本复杂,我建议使用这些非常简单的javascript函数。


function setSelectByValue(eID,val)
{//Loop through sequentially//
 var ele=document.getElementById(eID);
 for(var ii=0; ii<ele.length; ii++)
 if(ele.options[ii].value==val) {//Found!
 ele.options[ii].selected=true;
 return true;
 }
 return false;
}

function setSelectByText(eID,text)
{//Loop through sequentially//
 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;
}

1.7 + 最简单的方式是:


$("#myDropDown option:text=" + myText +"").attr("selected","selected"); 

1.9 +


$("#myDropDown option:text=" + myText +"").prop("selected","selected"); 

测试和工作。


 $("#Test").find("option:contains('two')").each(function(){
 if( $(this).text() == 'two' ) {
 $(this).attr("selected","selected");
 }
 });

如果语句与"两个"完全匹配,则不匹配"两到三"

就在旁边的便笺上。 未设置选定的值。 我在网上搜索所有的东西。 实际上我不得不回电的时候从一个网页服务,选择一个值之后,因为我在从中获取数据。


$("#SelectMonth option[value=" + DataFromWebService +"]").attr('selected', 'selected'); 
$("#SelectMonth").selectmenu('refresh', true);

所以选择器的刷新是我丢失的唯一东西。

看看 SelectedBox插件插件


selectOptions(value[, clear]): 

按值选择选项,使用字符串作为参数 $("#myselect2").selectOptions("Value 1"); 或者正则表达式 $("#myselect2").selectOptions(/^val/i);

你还可以清除已经选择的选项: $("#myselect2").selectOptions("Value 2", true);

我发现,通过使用 attr,你会得到多个选项,当你不想使用- 解决方案是使用 prop:

$("#myDropDown option:text=" + myText +"").prop("selected","selected");

...