2

代码索引.html

<div data-role="page" id="index">
    <div data-role="header">
        <h3>
            First Page
        </h3>
    </div>
    <div id="data">

    </div>
    <div data-role="content">
        <button data-role="button" id="changePage">Pass parameters with changePage function</button>
        <a href="second.html"  data-role="button">Or through a basic link</a>
    </div>
</div>

和我的 js 文件

 $(document).on('tap', "#changePage",function () {     
              $.mobile.changePage('second.html', { reloadPage : false, changeHash : true });
    });

和第二个.html

<div data-role="page" id="second">
    <div data-role="header">
        <h3>
            Second Page
        </h3>
    </div>
    <div data-role="content">
<div id="data"></div>
    <div data-role="button" id="clickBtn">click me</div>
    <div data-role="button" id="paqeBtn">change Page</div>
  </div>
 </div>

所有这些文件都使用 PhoneGap/Cordova 打包并在设备上运行。

基本上，我试图通过绑定到我的 JS 文件中的 ID #changePage 在点击事件上使用 $.mobile.changePage("second.html") 将 second.html 加载到 index.html 页面中。

这在

  • 安卓手机

  • Internet Explorer 9 和 10

  • Webkit 浏览器

但问题是上述代码不适用于 Windows Phone 8

我正在测试的设备是诺基亚 Lumia 920 Jquery 框架，使用的是

  • jquery.mobile-1.3.2.js

  • jquery-2.0.3.js

我还尝试使用 $.ajax 作为 dataType:"html" 和 $.load 函数，所有这些在上面提到的其他环境中都可以正常工作，除了 Window Phone 8（上面提到的设备）

我也跟着这个

Window 手机的 StackOverflow 解决方案

什么都没用！！！！

4

4 回答 4

2 
var url = window.location.href;
                            url = url.split('#').pop().split('?').pop();
                            url = url.replace(url.substring(url.lastIndexOf('/') + 1),"second.html");
                            $.mobile.changePage(url, { reloadPage : false, changeHash : false });

我使用了 OMAR jquery 1.9.1 建议的 Jquery。并且仍然需要在将 URL 传递到移动更改页面之前对其进行解析。上面的代码工作得很好。

以上代码仍然不适用于 Jquery 2.0+，请改用 1.9.x 版本！！-

我的建议是不要在 Windows Phones 上使用 jquery 2.0+

它不适用于 Window Phone 的包括 Ajax 调用，如 $.ajax、$.load、$.get

于 2013-09-26T07:29:37.967 回答
0

前几天我也遇到了同样的问题。changeHash 必须设置为 false$.mobile.changePage('second.html', { reloadPage : false, changeHash : true });

在较旧的 android 设备上也存在类似的问题。

于 2013-09-25T16:21:22.357 回答
0

我刚刚开始工作的内容与@conor 答案有点相似。也许尝试使用页面 css id 作为选择器。

使用 jQuery Mobile 1.3

jQuery：

$(document).ready(function () {

              $(".myinfo").on("tap", function(){
                                 $.mobile.changePage("#MyInfo", { transition: "none", reverse: false, changeHash: true});
                                   });

HTML：

 <div data-role="page" id="MyInfo">
        <div data-role="header" data-theme="e">

关联：

     <li><a href="#" data-icon="custom" class="myinfo">My Info</a></li>
于 2013-11-25T21:26:08.417 回答
0

@Nirus 的解决方案在以下环境中非常有效：

  • jQuery 1.9.1
  • jQM 1.3.2
  • Phonegap 3.5.0-0.21.14
  • 视窗电话 8.1

我希望Phonegap 或jQM 的团队能在不久的将来解决这个问题。

于 2014-09-22T15:46:35.523 回答