Question

我正在使用jquery mobile构建移动网站。它将包含一些用于设置等的静态内部页面，但主要是加载/链接外部页面。

我有两个要求。

我不希望内部页面影响URL栏或添加到 urlHistory（作为哈希，即index.html /＃设置）
当用户加载新的外部页面时，我确实希望它显示在 URL栏并添加到urlHistory。

这听起来很简单，但我似乎无法让它发挥作用。

我在mobileinit中尝试了以下内容。这根本不会修改URL，用于内部和外部链接。

$.mobile.changePage.defaults.changeHash = false;

非常感谢任何建议。

Answer 1

你很接近，mobilinit是一个棘手的事件，它必须在加载jQuery Mobile之前触发，这是一个例子：

<!DOCTYPE html>
<html>
<head>
    <title>jQM Complex Demo</title>
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0"/>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>    
    <script>
        $(document).bind("mobileinit", function(){
            $.mobile.changePage.defaults.changeHash = false;
        });
    </script>       
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>  
        <script src="operations.js"></script>       
</head>
<body>
    <div data-role="page" id="index">
        <div data-theme="a" data-role="header">
            <h3>
                First Page
            </h3>
            <a href="http://www.google.com" class="ui-btn-right" rel="external">Next</a>
        </div>

        <div data-role="content">
            <ul data-role="listview" data-theme="a" id="test-listview">
                <li><a href="page2.html?id=1">Link 1</a></li>
                <li><a href="page2.html?id=2">Link 2</a></li>
                <li><a href="page2.html?id=3">Link 3</a></li>
                <li><a href="page2.html?id=4">Link 4</a></li>
                <li><a href="page2.html?id=5">Link 5</a></li>
            </ul>    
        </div>

        <div data-theme="a" data-role="footer" data-position="fixed">

        </div>
    </div>    
</body>
</html>

测试它，你会发现它满足你的每一个要求。

Answer 2

行，在测试了各种各样的东西之后，我遇到了一个不涉及mobileinit的可能的解决方案。对于我不希望在url栏中反映的所有链接，我以编程方式设置：

$.mobile.changePage("#home", {changeHash: false, transition:'fade'});

这里的关键是将changeHash设置为false。这将转换到“主页”页面，但不会在URL栏中进行任何更改。

我不确定我是否可以在href标签内做同样的事情。

jQuery Mobile：控制添加到URL栏的内容

2 个答案: