Cordova 事件

2024 年 8 月 29 日 | 阅读 3 分钟

Cordova 为您的应用程序提供了一组各种事件。这些事件由应用程序在需要时触发。我们知道，有时我们需要确定我们的应用程序何时进入设备后台以及何时返回到前台。因此，对于此类任务，我们有事件监听器。

在这里，我们定义了一个应用程序代码，该代码可以添加事件监听器。

HTML 文件

<!DOCTYPE html>
<html>
    <head>
    <title>Device Ready </title>
    <script type="text/javascript" charset="utf-8" src="app.js"></script>
    <script type="text/javascript" charset="utf-8" src="apache.js"></script>
    </head>
    <body onload="onLoad()">
    </body>
</html>

JS 文件

// Waiting  for the libraries of device API to load
function onLoad() {
    document.addEventListener("deviceready", onDeviceReady, false);
}
// device APIs are available
//
function onDeviceReady() {
    document.addEventListener("pause", onPause, false);
    document.addEventListener("resume", onResume, false);
    document.addEventListener("menubutton", onMenuKeyDown, false);
    // similar listeners are added for another events
}
function onPause() {
    // Handles  pause event
}
function onResume() {
    // Handles resume event
}
function onMenuKeyDown() {
    // Handles menubutton event
}
// similar event handlers are added for another events

下表列出了 cordova 事件和支持的平台

支持的平台/ 事件	Android	Ios	Windows
deviceready	•	•	•
pause	•	•	•
resume	•	•	•
backbutton	•	×	•
menubutton	•	×	×
searchbutton	•	×	×
startcallbutton	×	×	×
endcallbutton	×	×	×
volumedownbutton	•	×	×
volumeupbutton	•	×	×
activated	×	×	•

deviceready

当 Cordova 应用程序完全加载时，将触发此事件。对于任何应用程序来说，它都是一个必不可少的事件。我们需要使用此事件来获取有关设备 API 的信息，即它们是否已加载并准备好访问。

Cordova 应用程序提供两个代码库，即原生和 JavaScript。加载原生代码时会显示自定义图像。但是，当 JavaScript 加载时，DOM 会加载。

一旦触发此事件，我们就可以安全地调用 Cordova API。

快速示例

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    // device APIs are safely use 
}

pause

当使用原生平台将应用程序运行到后台时，将触发此事件。它主要发生在用户切换到另一个应用程序时

快速示例

document.addEventListener("pause", onPause, false);
function onPause() {
  }

resume

仅当原生平台将应用程序从后台退出时，才会触发此事件。

快速示例

document.addEventListener("resume", onResume, false);
function onResume() {
}

backbutton

当用户点击后退按钮时，将触发此事件。如果您想覆盖默认后退按钮的行为，请为 backbutton 事件注册一个事件监听器。

快速示例

document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown() {
}

menubutton

当用户单击菜单按钮时，将触发此事件。要覆盖默认菜单按钮的行为，需要应用一个事件处理程序。

快速示例

document.addEventListener("menubutton", onMenuKeyDown, false);
function onMenuKeyDown() {
    // Handles back button
}

searchbutton

在 Android 平台上，仅当用户单击搜索按钮时，才会触发此事件。我们需要为此事件注册一个事件监听器，以覆盖默认搜索按钮的行为。

快速示例

document.addEventListener("searchbutton", onSearchKeyDown, false);
function onSearchKeyDown() {
}

startcallbutton

当用户单击开始呼叫按钮时，将触发此事件。我们需要为此特定事件注册一个事件监听器，以覆盖默认开始呼叫的行为。

快速示例

document.addEventListener("startcallbutton", onStartCallKeyDown, false);
function onStartCallKeyDown() {
}

endcallbutton

当用户单击结束呼叫按钮时，将触发此事件。要覆盖默认结束呼叫的行为，我们可以使用此事件。

快速示例

document.addEventListener("endcallbutton", onEndCallKeyDown, false);
function onEndCallKeyDown() {
}

volumedownbutton

当用户单击降低音量按钮时，将触发此事件。我们需要为此特定事件注册一个事件监听器，以覆盖默认降低音量的行为。

快速示例

document.addEventListener("volumedownbutton",onVolumeDownKeyDown, false);
function onVolumeDownKeyDown() {
}

volumeupbutton

当用户单击提高音量按钮时，将触发此事件。我们需要为此特定事件注册一个事件监听器，以覆盖默认提高音量的行为。

快速示例

document.addEventListener("volumeupbutton", onVolumeUpKeyDown, false);

function onVolumeUpKeyDown() {
}

activated

仅当发生 Windows 运行时激活时，才会触发此事件。

快速示例

document.addEventListener("activated", activated, false);

function activated(args) {
    if (args && args.kind === Windows.ApplicationModel.Activation.ActivationKind.file) {
       // Using args.raw to get the native StorageFile object
        Windows.Storage.FileIO.readTextAsync(args.raw.detail[0].files[0]).done(function (text) {
            console.log(text);
        }, function (err) {
            console.error(err);
        });
    }
}

下一个主题Cordova Hooks

← 上一步下一步 →

Cordova 事件

HTML 文件

JS 文件

deviceready

pause

resume

backbutton

menubutton

searchbutton

startcallbutton

endcallbutton

volumedownbutton

volumeupbutton

activated

联系信息

关注我们

教程

面试题

在线编译器

Python

Java

.Net Framework

AI, ML and Data Science

Cloud Technology

B.Tech and MCA

Web Technology

PHP

Software Testing

Technical Interview

Java Interview

Python

Web Interview

Database Interview

B.Tech / MCA

Important Interview

Software Testing Interview

Company Interviews

Online Compilers

Multiple Choice Questions

Apache Cordova

Cordova 插件 API

Cordova 事件

HTML 文件

JS 文件

deviceready

pause

resume

backbutton

menubutton

searchbutton

startcallbutton

endcallbutton

volumedownbutton

volumeupbutton

activated

相关帖子

Apache Cordova 教程

Config.xml 文件

Cordova 安装

Cordova 钩子

Cordova 架构

Cordova 应用模板

创建第一个应用程序

Cordova PhoneGap

用于混合移动应用开发的顶级 Cordova 框架

订阅 Tpoint Tech

联系信息

关注我们

教程

面试题

在线编译器