1

我正在使用 JQuery Mobile 创建一个移动网站。我有链接到 div 的内部链接。第一个有效，但第二个链接（除了链接和文本外具有完全相同的格式）不起作用。有什么理由吗？

4

2 回答 2

2

您data-role="page"在代码中使用多个 's 吗？
如果是这样，您将需要使用子页面小部件并将 children 替换为page“ subpage”。

来自jQuery Mobile 文档 - 链接页面

注意：您不能链接到激活 Ajax 导航的多页文档，因为框架只会加载它找到的第一个页面，而不是完整的内部页面集。在这些情况下，您必须在不使用 Ajax 的情况下进行链接（请参阅下一节）以进行整页刷新，以防止潜在的哈希冲突。当前有一个子页面插件，可以加载多页文档。

于 2012-09-10T22:37:50.583 回答
1

我相信 OP 是（可能）问的是他/她有一些带有“快速导航”菜单系统的页面，可以跳到特定的标题，而不必单独手动向下滚动到每个标题 - 经常发现（或使用无论如何）在内容丰富的冗长页面上。就像是：

<div id="quick_nav_menu">
    <a href="#heading1">Heading 1</a>
    <a href="#heading2">Heading 2</a>
... <a href="#headingLast">Last Heading</a>
</div>
...
<h1 id="heading1">Heading 1</h1>

单击其中一个 quick_nav_menu 链接会导致“错误加载页面”...错误。不幸的是，添加诸如“rel='external'”或“data-ajax='false'”之类的东西并不会产生更好的结果。我自己正在研究解决这个问题的方法。

更新

我自己用一点 JavaScript (jQuery) 解决了这个问题。我抓住了每个 quick_nav_menu 链接，并为每个链接附加了一个点击事件。click 事件提取每个超链接的 href 属性，在 hash 标记处将其拆分，从而生成一个包含两个元素（第一个元素为空）的列表：[, headerId]。它获取第二个列表项（标题的 ID），并使用 scrollIntoView() JavaScript 方法向下滚动到它。然后它返回“false”以禁止超链接的默认行为。

前任。

$(document).ready(function () {
    $("#quick_nav_menu a").click(function () {
        var href = $(this).attr("href");
        var headerId = href.split("#")[1];
        document.getElementById(headerId).scrollIntoView();
        return false;
    });
});

不幸的是，在 Web 浏览器上按下后退按钮不会让用户返回到 quick_nav_menu，而是滚动回上一个 jquery Mobile 页面，但它对于我的目的来说已经足够好了。

于 2013-05-02T23:28:01.780 回答