Question

使用JQuery 1.11，我无法强制选择一个选项。我知道选项的文本，所以我正在使用

.find('option[text="Canada"]')

但是我的表达式并没有找到该项目，尽管在控制台（下面列出的输出）中，您可以清楚地看到有一个选项显示为“Canada”。

> $('.countryField')
[<select id="user[address]_country" name="user[address][country]" class="countryField select-hidden">…</select><option value="0">-- Select --</option><option value="38">Canada</option>…<option value="249">Zimbabwe</option></select>]
> $('.countryField').find('option[text="Canada"]')
[]

我做错了什么？最终，我想为具有给定文本的选项启用“selected”属性（并且所有其他选项都没有“selected”属性）。

Answer 1

您可以尝试以下方法之一。

$(".countryField option").each(function(){
  if ($(this).text() == "Canada")
    $(this).attr("selected","selected");
});


$(".countryField option[value='Canada']").attr("selected","selected");

Answer 2

您只需使用jQuery val选择元素即可。

＆＃13;

$(function () {
  $("#speed").selectmenu();

  // select the Canada option
  $("#speed").val('Canada');
  $("#speed").selectmenu('refresh');
  
  // instead if you need to get the option with Canada text
  var selectedEle = $("#speed option").filter(function(i, e) {return $(e).text() == 'Canada';});
  console.log(selectedEle[0].outerHTML);
});

＆＃13;

#speed {
  width: 200px;
}

＆＃13;

<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<select name="speed" id="speed">
    <option>Slower</option>
    <option>Slow</option>
    <option selected="selected">Medium</option>
    <option>Fast</option>
    <option>Faster</option>
    <option>Canada</option>
</select>

＆＃13;

如何强制从JQuery中的选择菜单中选择一个选项？

2 个答案: