Apache Cordova-混合移动应用程序页面像chrome浏览器一样打开，而不像Cordova应用程序

Apache Cordova - Hybrid Mobile Application page opening like a chrome browser not like cordova application

本文关键字：应用程序 一样 Cordova 移动 混合 Cordova- Apache 浏览器 chrome      更新时间：2023-09-26

我正在Cordova上使用HTML、CSS和Javascript开发混合移动应用程序。

我们如何才能从一个页面重定向到其他页面，而不是像浏览器应用程序那样，它必须是Cordova应用程序。

它在浏览器中运行良好，但如果我生成.apk文件并部署到移动设备上，它的工作方式与web应用程序不同，而与Cordova应用程序不同。在这里，我使用的是window.open（）、window.location.href（）和window.location.replacement（）.等代码

          $(document).ready(function() {
            $("#btn4").click(function() {
                $lname = $("#lname").val();
                $.ajax({
                    url: 'http://localhost:8080/RESTfulDemoDerby/webresources/com.mss.mmxregistration/session',
                    data: {lname: $lname},
                    type: 'GET',
                    crossDomain: true,
                    ContentType: 'html/text',
                    dataType: 'text',
                    cache: false
            }).done(function(response) {
                   if (response== 'success') {
   window.location.href='http://localhost:8383/HTML5Application1/listform.html';
                   }
                    else {
                 window.location.replace("http://localhost:8383/HTML5Application1/login1.html");
                    }
             }).fail(function(request, textStatus, errorThrown) {
                    //   alert(url);
                    alert(textStatus + " : " + errorThrown.toString());
                });
            });
        });

让我澄清一下，我们是否可以在Cordova应用程序中添加PhoneGap插件？因为两者都是使用HTML、CSS和Javascript开发混合应用程序的不同平台。

您应该更深入地了解cordova/phonegap及其全部内容。使用phonegap/cordova构建混合应用程序的正常方法是建立一个单页应用程序。

这意味着，您使用一个框架：例如-jquery mobile。在这个框架的帮助下，您可以设置一个单页应用程序。

例如，您可以设置永久工具栏。完成后，您可以通过普通的<a href="#pageID">Page 2</a>导航页面，其中#pageID必须是您要导航到的页面的id。

单页应用程序模板如下所示：

<div data-role="page" id="page1" data-title="Page 1">
    <div class="content">
        <a href="#page2">Testcontent Page 2 - Go to Page 2</a>
    </div>
</div>
<div data-role="page" id="page2" data-title="Page 2">
    <div class="content">
        <a href="#page1">Testcontent Page 2 - Back to Page 1</a>
    </div>
</div>

data-title="Page 1"是将通过JavaScript和jQuery自动更改的标题。它将替换持久头中的<h1></h1>标签内容。

只要谷歌的单页应用程序Cordova教程或类似的东西，就会有很多结果。

Cordova文档5.0

珊瑚礁的珊瑚礁

如果没有那些伟大的插件，Cordova就不会像现在这样广为人知。插件的列表几乎是无穷无尽的，每天都有新的插件。

您可以通过终端安装插件。

  1. cd您的项目
  2. cordova插件添加cordova pluginName其中CCD_ 5将是该插件的名称。例如：控制台
  3. cordova插件添加cordova插件控制台

在您将这样一个插件添加到项目中后，您将运行构建命令（cordova build-在构建应用程序的正常方式中集成"插件添加过程"。

所以现在，在你添加了你想要的插件后，你可以使用插件带来的命令。但请注意：您必须等待deviceReady事件，然后才能使用插件。

DeviceReady事件示例

<!DOCTYPE html>
<html>
  <head>
    <title>Device Ready Example</title>
    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script type="text/javascript" charset="utf-8">
    // Wait for device API libraries to load
    //
    function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }
    // device APIs are available
    //
    function onDeviceReady() {
        // Now safe to use device APIs
    }
    </script>
  </head>
  <body onload="onLoad()">
  </body>
</html>

您可以在cordova事件文档中找到有关该事件和所有其他事件的详细信息。

相关文章：