使.selectedIndex与JQuery Mobile框架中的选择框一起使用时出现问题

Question

我有一系列选择保管箱设置，其内容根据之前的选择而动态更新。 串联选择效果很好。

当我尝试返回顶部并重新开始时，即使我尝试使用

my_select.selectedIndex = 0;

子选择框保持不变。 我以为是Javascript错误，但发现JSFiddle示例确实有效，但是我在JQuery mobile中的代码不起作用-使我相信这是与JQuery Mobile相关的问题

您可以在http://jsfiddle.net/vinomarky/xfcdF/上看到一个JSFiddle示例。

复制步骤：

1. 从类型中选择“套管”
2. 从OD中选择5
3. 将类型更改为油管

JSFiddle示例的行为符合预期-将子级重置为“-”，而我的“实时” JQuery Mobile示例没有

有什么想法吗？

Answer 1

您正在操纵jQuery Mobile背后的DOM，但从未告诉jQuery Mobile发生了任何变化。

更改基础的<select>之后，需要调用refresh方法 ：

刷新更新自定义选择

这用于更新自定义选择以反映本机选择元素的值。如果选择中的选项数量与自定义菜单中的项目数量不同，它将重建自定义菜单。

因此，您需要添加以下内容：

$('#od').selectmenu('refresh');

在变更处理程序的底部。 当然，要刷新的元素确实取决于您所在的更改处理程序。

演示： http ： //jsfiddle.net/ambiguous/n3VXe/

您的提琴效果很好，因为它根本没有使用jQuery Mobile。

另外，您不应该在2012年使用onchange属性，而是要加载jQuery，因此应该使用它将处理程序绑定到您感兴趣的事件。您可能还希望用jQuery替换所有直接的DOM操作。