首页 > 解决方案 > 如何在apache cordova中完成页面滑动

问题描述

我正在努力在 apache cordova 上构建一个移动应用程序。我正在使用最新版本 9.0.0 (cordova-lib@9.0.1)。我创建了 index.html 代码在科尔多瓦浏览器上运行良好。但它不能在安卓设备上运行。我没有检查模拟器,因为我的系统不支持模拟器(你可以说硬件加速失败)。所以我在我的android手机上安装了apk。但该应用程序不起作用。这是我的代码:-

索引.html

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
  href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script
  src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
<script src="js/swipe.js"></script>  
</head>
<body>
  <div data-role="page" id="firstpage">
    <div data-role="header">
      <h1>Swipe Left</h1>
    </div>
    <div data-role="content">
      <p>Swipe Left to get to the next page.</p>
    </div>
  </div>
  <div data-role="page" id="secondpage">
    <div data-role="header">
      <h1>Swipe Right</h1>
    </div>
    <div data-role="content">
      <p>Swipe Right to get to the next page.</p>
    </div>
  </div>

</body>
</html>

下面是我的 swipe.js

$(document).delegate("#firstpage", 'pageinit', function (evt) {
    $(this).bind("swipeleft", function (e) {
        $.mobile.changePage("#secondpage", {
        });
    });
})

$(document).delegate("#secondpage", 'pageinit', function (evt) {
    $(this).bind("swiperight", function (e) {
        $.mobile.changePage("#firstpage", {
        });
    });
});

任何人都可以建议如何在 apache cordova 中实现页面滑动。

我想要的是?我想通过在移动屏幕上滑动手指来转到下一页(或 div)。

我已经完成了所有网络的搜索,但代码在浏览器中有效,但在 android 设备上无效。

任何帮助,将不胜感激。

标签: androidcordovamobiletouchswipe

解决方案


您应该使用 Chrome Device Inspector 调试手机上运行的应用程序。

无论如何,尝试将您的 JS 和 CSS 资源移动到您的本地路径,以便将它们嵌入到应用程序中,可能由于安全策略,它们的下载被阻止。


推荐阅读