2011-12-16 63 views
3

我正在用Jquery Mobile編寫一個網上商店,我想使用選擇菜單瀏覽可用的類別。當用戶選擇一個類別時,我想導航到相同的頁面,但有一些參數添加到了URL中。這是我的選擇標記:Jquery Mobile Select不重置

<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仍然retreives以前的值;選擇似乎沒有重置!但是,當我按F5並手動重新加載頁面時,菜單再次運行,直到我使用過一次。

任何人有任何想法,我怎麼能解決這個問題?正如你在javascript中看到的,「reloadPage:true」屬性不能解決問題。

回答

6

你將需要重置此個人信息,也許嘗試:

$('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); 

我也有類似的問題,有一天

+0

是的,就像一個魅力。謝謝一堆! – karl 2011-12-20 07:10:48

1

您試過$('#productCatSelectMenu').selectmenu('refresh');

您可以檢查有關refresh方法in the documentation

+0

這將刷新JQM控制,但沒有將selectedIndex – 2011-12-16 15:37:18

10

如果你正在使用jQuery Mobile的定製選擇字段,嘗試

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

這將成功重置jQuery mobile提供的選擇選項。

+0

如果它可以幫助別人,我也與jQuery手機,並尋找很長時間後如何重置選擇我來到這個解決方案基於蒂莫西的答案:`$(「#form_id select」)。selectmenu('refresh ',true);` – kevin 2012-10-25 20:35:14

3

我不知道爲什麼JQuery的移動選擇工作的方式。除了這裏提到的內容之外,以上都不適用於我。我使用的是最新版本 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");