jQuery Mobile 更改 DropDown Selected Option 并刷新它
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8153226/
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
jQuery Mobile Change DropDown Selected Option and refresh it
提问by Anand
I am writing jQuery Mobile App. I am changing drop-down selected option via below statement:- $("#DataBaseNames").val(db);
我正在编写 jQuery 移动应用程序。我正在通过以下语句更改下拉选择的选项：- $("#DataBaseNames").val(db);
I am sure about correct db value being passed, as i checked it via alert. When I drill down the drop down, it also shows the correct text selected, but dropdown itself is not showing the correct text as selected.
我确定传递了正确的 db 值，因为我通过警报检查了它。当我向下钻取下拉菜单时，它还会显示所选的正确文本，但下拉菜单本身并未显示所选的正确文本。
Any refresh call I need to insert?
我需要插入任何刷新调用？
Edit:-Adding code, below answer from phill solved it
编辑：-添加代码，下面来自 phill 的回答解决了它
<script type="text/javascript">
$("#@ViewBag.DivTitle").live('pageshow', function () {
var db = getCookie("DataBaseNames");
$("#DataBaseNames").val(db);
$("#DataBaseNames option[value='"+ db + "']").attr("selected", "selected");
// refresh value , Following is what is required
$('select').selectmenu('refresh');
$("#cmdLogOn").live("click", function () {
var dbSelected = $("#DataBaseNames option:selected").text();
setCookie('DataBaseNames', dbSelected);
});
});
function setCookie(name, value) {
var expires = "";
document.cookie = name + "=" + value + expires + "; path=/";
}
function getCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
}
return null;
}
</script>
回答by Phill Pafford
refresh update the custom select
This is used to update the custom select to reflect the native select element's value.If the number of options in the select are different than the number of items in the custom menu, it'll rebuild the custom menu. Also, if you pass a true argument you can force the rebuild to happen.
刷新更新自定义选择
这用于更新自定义选择以反映本机选择元素的值。如果选择中的选项数与自定义菜单中的项目数不同，它将重建自定义菜单。此外，如果您传递一个 true 参数，您可以强制重建发生。
//refresh value
$('select').selectmenu('refresh');
//refresh and force rebuild
$('select').selectmenu('refresh', true);
Docs:
文档：
回答by Silver
回答by user3383017
If you want to change one dropdown based on another use this.
如果您想根据另一个更改一个下拉列表，请使用此选项。
<link href="code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" rel="stylesheet"/>
<link href="jquery/css/index.css" rel="stylesheet"/>
<link href="../favicon.ico" rel="shortcut icon"/>
<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet"/>
<link href="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.js"></script>
<script type="text/javascript">
function ItemNo()
{
var no = $('#sltItemNo')[0].selectedIndex;
var myselect = $("select#sltItemName");
myselect[0].selectedIndex =no;
myselect.selectmenu("refresh");
}
function ItemName()
{
var no = $('#sltItemName')[0].selectedIndex;
var myselect = $("select#sltItemNo");
myselect[0].selectedIndex =no;
myselect.selectmenu("refresh");
}
</script>
<select id="sltItemNo" onchange="ItemNo()" data-shadow="false" data-mini="true">
<option value="Abc">1</option>
<option value="Cde">2</option>
<option value="Efg">3</option>
</select>
<select id="sltItemName" onchange="ItemName()" data-shadow="false" data-mini="true">
<option value="1">Abc</option>
<option value="2">Cde</option>
<option value="3">Efg</option>
</select>
