Question

这是我第一次使用jQuery Mobile，我实际上是从我得到的WP主题中使用它。我知道这可能与主题有关，但我只想确定。

所以，它是一个Wordpress jQuery Mobile主题，你插上它就可以了。问题是，我已经将Wordpress菜单从UL转换为SELECT。

然后我添加了一些jQuery，通过获取所选选项的值来激活选择。这有效，我得到加载的东西，然后页面改变我想要的效果。

但我无法通过“选择”菜单显示当前所选项目。它总是回归到第一个。

我用过：

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

但没有......

您可以在此处查看该网站：http://avatarblog.fl1hosting.com/并查看来源。

你会看到我的移动事件都在jQuery Mobile包含之前，这对我来说没有多大意义，但是如果我之后放了它们，那么一切都无效。

任何帮助都将受到高度赞赏！

由于

Answer 1

您需要设置选择菜单中显示的选项。试试这个，

$("#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");
    });

jQuery Mobile - 更改页面和选择菜单不起作用

1 个答案: