如何在 jQuery ui 选择菜单中动态选择一个选项？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4444788/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to select an option in a jQuery ui selectmenu dynamically?
提问by Jamie
After changing a menu from a regular select to a jQuery selectmenu, I can no longer select options in it programatically. Is there a way to do this?
将菜单从常规选择更改为 jQuery 选择菜单后，我无法再以编程方式选择其中的选项。有没有办法做到这一点？
The code to select is (assuming ListId is the actual Id of the list)
要选择的代码是（假设 ListId 是列表的实际 Id）
$('#ListId').val(value);
The plugin is activited like this:
该插件是这样激活的：
$("#ListId").selectmenu({ style: "dropdown", width:140 });
Is there a way to select an item in the select menu? Calling the same .val(value) function just selects the value in the hidden original select list, not the nicely styled jQuery selectmenu.
有没有办法在选择菜单中选择一个项目？调用相同的 .val(value) 函数只会选择隐藏的原始选择列表中的值，而不是样式精美的 jQuery 选择菜单。
回答by Brandon Joyce
$('#ListId').selectmenu("value", value);
回答by Coder_X
Assuming that you have already done this part once before:
假设你之前已经做过这部分：
$("#ListId").selectmenu({ style: "dropdown", width:140 });
I found this works:
我发现这有效：
$('#ListId').val(value);
$('#ListId').selectmenu("refresh");
This causes the the stylized drop down to show the correct value.
这会导致风格化的下拉菜单显示正确的值。
回答by Jojje
You could additionally trigger the change event handler by adding a change call:
您还可以通过添加更改调用来触发更改事件处理程序：
$('#ListId').selectmenu("value", value);
$('#ListId').selectmenu("change"); // Add this for a change event to occur
回答by proph
Please note you must use indexes(not values) to select the option using this method.
请注意，您必须使用索引（而不是值）来选择使用此方法的选项。
For instance, given this select.
例如，给定这个选择。
<select id="ListId">
<option value="value-one">One</option>
<option value="value-two">Two</option>
</select>
In this case the expression $('#ListId').selectmenu("value", "value-two");wouldn't return any result. Instead of that, we have to use $('#ListId').selectmenu("value", "2");. In other words, we have to use the position/index of the element inside the select. Not the value!
在这种情况下，表达式$('#ListId').selectmenu("value", "value-two");不会返回任何结果。取而代之的是，我们必须使用$('#ListId').selectmenu("value", "2");. 换句话说，我们必须使用 select 中元素的位置/索引。不是价值！
Finding the index is easy though. You can use the following line to achieve it.
不过，查找索引很容易。您可以使用以下行来实现它。
var index = $('#ListID option[value="value-two"]').index();
$('#ListId').selectmenu("value", index);
回答by Kevin Lin
I have tried the following, and it does not work in my situation
我尝试了以下方法，但在我的情况下不起作用
1.
1.
$('#ListId').val(value);
$('#ListId').selectmenu("refresh");
2.
2.
$('#ListId').selectmenu("value", value);
3.
3.
var option = $("#ListID option")
option.attr("selected", true);
// option.prop("selected", true);
// option.attr("selected", "selected");
// option.prop("selected", "selected");
$('#ListId').selectmenu("refresh");
refresh, selected ....etc. and in some situation it does not work.
刷新，选择....等。在某些情况下它不起作用。
Therefore, I press ctrl+Iin chrome to see the source code. and I use the following code to solve my situation.
因此，我在 chrome 中按ctrl+I查看源代码。我使用以下代码来解决我的情况。
// Set Component Separator jQuery UI SelectMenu
componentSeparatorPlaceHolder.find(".ui-selectmenu-text").html(inputComponentSeparatorStr);
// Set ComponentSeparatorDropDown
componentSeparator.val(inputComponentSeparatorStr);
回答by Nimesh
I have tried the following ways, and it does work in my situation
我尝试了以下方法，它确实适用于我的情况
$('#ListId').find('option[value=""]').attr("selected", true);
OR
或者
$('#ListId').prop('selectedIndex', 0);
