Jquery Mobile 嵌套列表 - 后退按钮不见了？

Question

在最新版本的 jQuery Mobile 中，添加后退按钮的方法是将“data-add-back-btn="true"”添加到整个“页面”div 中。

这很好用。但是，当查看嵌套列表子菜单时，后退按钮不再存在。

通过查看输出代码，似乎发生的情况是，jquery mobile 隐藏了原始的“页面”div，并创建了一个新的 div(没有将后退按钮属性设置为 true)。

我目前没有演示 URL，但您可以在演示页面 http://jquerymobile.com/test/docs/lists/lists-nested.html 上查看实际问题。

我的问题是，是否需要添加一些内容，告诉它为嵌套菜单添加后退按钮？如果没有，有什么方法可以破解它以自动将后退按钮属性添加到所有“页面”div 中？

感谢对此问题的任何帮助。

Answer 1

这样的事情应该有帮助:

$(':jqmData(url^=MYPAGEID)').live('pagebeforecreate', 
  function(event) {
    $(this).filter(':jqmData(url*=ui-page)').find(':jqmData(role=header)')
      .prepend('<a href="#" data-rel="back" data-icon="back">Back</a>')
  });

将 MYPAGEID 替换为包含列表的页面的 ID。

动态创建子页面时会触发该事件，并将后退按钮作为页眉中的第一项插入。当 jQueryMobile 魔法随后自动运行时，它将被拾取并变得很好。

过滤有点奇怪，因为您无法在第一个选择器中引用ui-page(它会偶然发现data-中的&) url 并且看来您不能在 .live() 之前使用过滤器)如果没有这个额外的过滤，您也会在父页面上获得后退按钮。