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和选择菜单不工作

回答

相关问题