如何动态选择jQuery ui selectmenu中的选项？

将菜单从常规选择更改为jQuery选择菜单后，我无法再以编程方式选择其中的选项。 有没有办法做到这一点？

要选择的代码是（假设ListId是列表的实际ID）

$('#ListId').val(value); 

该插件被激活如下：

 $("#ListId").selectmenu({ style: "dropdown", width:140 }); 

有没有办法在选择菜单中选择一个项目？ 调用相同的.val（value）函数只选择隐藏原始选择列表中的值，而不是选择风格很好的jQuery selectmenu。

Answer 1

 $('#ListId').selectmenu("value", value); 

Answer 2

假设您之前已经完成过这个部分：

 $("#ListId").selectmenu({ style: "dropdown", width:140 }); 

我发现这个有效：

 $('#ListId').val(value); $('#ListId').selectmenu("refresh"); 

这会导致程式化下拉显示正确的值。

Answer 3

您还可以通过添加更改调用来触发更改事件处理程序：

 $('#ListId').selectmenu("value", value); $('#ListId').selectmenu("change"); // Add this for a change event to occur 

Answer 4

请注意，您必须使用索引 （而不是值）来使用此方法选择选项。

例如，给出这个选择。

  One Two  

在这种情况下表达式$('#ListId').selectmenu("value", "value-two"); 不会返回任何结果。 而不是那样，我们必须使用$('#ListId').selectmenu("value", "2"); 。 换句话说，我们必须使用select中元素的位置/索引。 不是价值！

虽然找到索引很容易。 您可以使用以下行来实现它。

 var index = $('#ListID option[value="value-two"]').index(); $('#ListId').selectmenu("value", index); 

Answer 5

我尝试了以下，但在我的情况下它不起作用

1。

 $('#ListId').val(value); $('#ListId').selectmenu("refresh"); 

2。

 $('#ListId').selectmenu("value", value); 

3。

 var option = $("#ListID option") option.attr("selected", true); // option.prop("selected", true); // option.attr("selected", "selected"); // option.prop("selected", "selected"); $('#ListId').selectmenu("refresh"); 

刷新，选择….等。 在某些情况下它不起作用。

因此，我在chrome中按ctrl + I来查看源代码。 我使用以下代码来解决我的情况。

 // Set Component Separator jQuery UI SelectMenu componentSeparatorPlaceHolder.find(".ui-selectmenu-text").html(inputComponentSeparatorStr); // Set ComponentSeparatorDropDown componentSeparator.val(inputComponentSeparatorStr); 

Answer 6

我尝试了以下方法，它确实适用于我的情况

 $('#ListId').find('option[value=""]').attr("selected", true); 

要么

 $('#ListId').prop('selectedIndex', 0);