Jquery Mobile Select 不会重置答案

【问题标题】：Jquery Mobile Select does not resetJquery Mobile Select 不会重置
【发布时间】：2011-12-16 12:31:54
【问题描述】：

我正在使用 Jquery Mobile 编写一个网上商店，我想在其中使用选择菜单来浏览可用的类别。当用户选择一个类别时，我想导航到同一页面，但在 url 中添加了几个参数。这是我的选择标记：

  <asp:Repeater id="productCatSelect" runat="server">
                <HeaderTemplate>
                        <select id="productCatSelectMenu" data-native-menu="false" onchange="categoryClick();" class="button" data-theme="a">
                        <option data-placeholder="true">All Categories</option>
                </HeaderTemplate>
                <ItemTemplate>
                    <option value="<%# Eval("NodeID") %>" ><%# Eval("Description")%></option>
                </ItemTemplate>
                <FooterTemplate>
                    </select>
                </FooterTemplate>
</asp:Repeater>

这里是javascript：

function categoryClick() {
    var mySelect = $("#productCatSelectMenu");
    if (mySelect.val() != '') {
        if (mySelect.val() == 0) {
            $.mobile.changePage("shop.aspx", {reloadPage: true, transition:"slide"});
        } else {
            $.mobile.changePage("shop.aspx?c=" + $("#productCatSelectMenu").val() + "&n=" + $('#productCatSelectMenu :selected').text(), {reloadPage: true, transition:"slide"});
        }
    }
}

当我导航一次并尝试从选择中选择另一个选项时，我的问题发生了，我的 javascript 仍然检索以前的值；选择似乎没有重置！但是，当我按 F5 并手动重新加载页面时，菜单会再次起作用，直到我使用过一次。

有人对我如何解决这个问题有任何想法吗？正如您在 javascript 中看到的，“reloadPage: true”属性不能解决问题。

【问题讨论】：

标签： jquery-mobile

【解决方案1】：

如果您使用 jQuery Mobile 的自定义选择字段，请尝试

$("#select_id").selectmenu('refresh', true)

这将成功重置 jQuery mobile 呈现的选择选项。

【讨论】：

如果它可以帮助其他人，我也在使用 jQuery mobile，在寻找了很长时间关于如何重置选择之后，我根据 Timothy 的回答找到了这个解决方案：$("#form_id select").selectmenu('refresh', true);
您可能仍需要删除 attr，具体取决于页面加载的状态。 $("#select_id option").removeAttr('selected');

【解决方案2】：

你需要自己重置，也许试试：

$('select#productCatSelectMenu option').attr('selected', false);

或

$('select#productCatSelectMenu option').removeAttr('selected');

或

$('select#productCatSelectMenu').children('option').removeAttr('selected').filter(':nth-child(1)').attr('selected', true);

或

$('select#productCatSelectMenu').attr('selectedIndex', -1);

前几天我也遇到了类似的问题

Reset/Un-select Select Option

【讨论】：

除非添加$('select#productCatSelectMenu').selectmenu("refresh");，否则不起作用，喜欢@user3679385的答案，

【解决方案3】：

我不知道为什么 Jquery mobile select 会这样工作。除了这里提到的以外，以上都没有对我有用。我正在使用当前版本 jquery-1.10.2.min.js jquery.mobile-1.4.2.min.js

https://forum.jquery.com/topic/resetting-select-menu

var myselect = $("select#useOfColor");
myselect[0].selectedIndex = 0;
myselect.selectmenu("refresh");

【讨论】：

【解决方案4】：

你试过$('#productCatSelectMenu').selectmenu('refresh');吗？

您可以查看有关refresh方法in the documentation的信息

【讨论】：

这将刷新 jQM 控件，但不会刷新 selectedIndex