jQuery Mobile - changePage和選擇菜單不工作

這是我第一次使用jQuery Mobile，我實際上是從WP主題中使用它。我明白，這可能是主題相關的，但我只是想確定。jQuery Mobile - changePage和選擇菜單不工作

所以，它是一個WordPress的jQuery Mobile主題，你插上它，它的工作原理。事情是，我已經將Wordpress菜單從UL轉換爲SELECT。

然後，我添加了一些jQuery來通過獲取所選選項的值來觸發選擇。這有效，我得到了裝載東西，然後頁面隨着我想要的效果而改變。

但我無法使Select菜單顯示當前選定的項目。它總是回覆到第一個。

我用：

$('#main_menu').selectmenu("refresh"); 
$('#main_menu').selectmenu("refresh", true);

但沒有......

你可以看看這裏的網站：http://avatarblog.fl1hosting.com/，並期待在源。

你會看到我的手機事件都在jQuery Mobile包含之前，這對我來說沒有什麼意義，但是如果我之後放置它們，那什麼都行不通。

任何幫助將不勝感激！

感謝

來源

2012-07-24 elmediano

你需要設置在選擇菜單中顯示的選項。試試這個，

$("#main_menu")[0].selectedIndex = 2; // this will select the 3rd in the menu list 
$("#main_menu").selectmenu("refresh");

您可以添加下面的腳本您的header.php：

$(document) 
.unbind("pageshow.initMenuBtn") 
.bind("pageshow.initMenuBtn", 
    function() { 
     $.mobile.activePage = $("div.ui-page-active"); 
     $("#main_menu", $.mobile.activePage) 
      .unbind("change") 
      .bind("change", function() { 
       var page = $(this).val(); 
       $.mobile.changePage(page); 
      }); 

     var selectedIndex = 0; 
     $("#main_menu>option", $.mobile.activePage).each(function(index) { 
      if ($(this).hasClass("current-menu-item")) { 
       selectedIndex = index; 
      } 
     }); 
     $("#main_menu", $.mobile.activePage)[0].selectedIndex = selectedIndex; 
     $("#main_menu", $.mobile.activePage).selectmenu("refresh"); 
    });

來源

2012-07-24 14:36:10

你好周杰倫。恐怕沒有用。此外，我不完全明白...不是代碼總是顯示列表中的第三項？我試圖做的是顯示當前頁面項目，所以如果我點擊關於我們，選擇顯示關於我們等等。謝謝你的幫助。 – elmediano 2012-07-25 15:02:03

是的，它不會像那樣工作。請在我上面的帖子中查看我的更新。在第一個代碼中，我只是給你一個想法，爲什麼你的調用$（「＃main_menu」）。selectmenu（「刷新」）;沒有按照你的預期工作。這實際上是因爲你所選的價值永遠是第一選擇。 – 2012-07-25 15:50:19

謝謝你。恐怕也沒有用。這是一個WordPress的網站，所以我添加了所有模板上包含的header.php中的所有代碼。選擇列表是從數據庫動態生成的，當單擊某個選項時，jQuery將獲取該選項的值並將changePage激發到該值。 – elmediano 2012-07-25 15:56:28

jQuery Mobile - changePage和選擇菜單不工作

回答

相關問題