cordova 事件

最新推荐文章于 2024-05-21 11:00:42 发布
最新推荐文章于 2024-05-21 11:00:42 发布
阅读量1.5k 收藏
点赞数
分类专栏： cordova 文章标签： cordova event 事件 webapp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/michael_ouyang/article/details/75008452
版权


简介

有了cordova 应用程序所使用的各种事件，应用程序代码可以为这些事件添加侦听器。例如:

HTML File

<!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" src="example.js"></script>
    </head>
    <body οnlοad="onLoad()">
    </body></html>


JS File

// example.js file
// Wait for device API libraries 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);
// Add similar listeners for other events
}
function onPause() {
// Handle the pause event
}
function onResume() {
// Handle the resume event
}
function onMenuKeyDown() {
// Handle the menubutton event
}
// Add similar event handlers for other events


注意：应用程序通常应该使用document.addEventListener附加一个事件监听器deviceready

 

 



支持的平台

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

 

 

 

 

deviceready

当cordova被完全加载时会触发deviceready事件，这是每个cordova应用程序都会用到的重要事件。

cordova包含两套代码库：本地代码库和javaScript代码库。当本地代码加载时会显示一个自定义的加载图片，但是javaScript只是在DOM加载后才会被加载。这潜在的说明用户的WEB应用程序可以在cordova加载完成之前调用相应的javaScript函数。cordova一旦完全加载就会触发deviceready事件。待设备触发改事件后，用户就可以安全地进行cordova函数调用了。

在通常情况下，用户会希望在HTML文件的DOM加载完毕后使用document.addEventListener附加一个事件监听器。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    // Now safe to use device APIs

}

 

  

  

pause

当cordova应用程序被放在后台的时候触发pause事件。

前面讲过，cordova包含两套代码库：本地代码库和javaScript代码库。当本地代码将应用程序放到后台的时候，会触发pause事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    document.addEventListener("pause", onPause, false);

}

function onPause() {

    // Handle the pause event

}

  

 

 

resume

当cordova应用程序恢复到前台运行的时候触发resume事件。

当本地代码将应用程序从后台提取到前台运行的时候将会触发resume事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    document.addEventListener("resume", onResume, false);

}

function onResume() {

    // Handle the resume event

}

  

 

 

backbutton

当用户在android系统上单击“后退”按钮的时候触发backbutton事件。

如果需要在android系统上重载默认“后退”按钮的行为，可以通过注册一个事件监听器来监听backbutton事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    document.addEventListener("backbutton", onBackKeyDown, false);

}

function onBackKeyDown() {

    // Handle the back button

}

  

 

 

menubutton

当用虎在android系统上单击“菜单”按钮的时候触发menubutton事件。

如果需要在android系统上重载默认“菜单”按钮的行为，可以通过注册一个事件监听器来监听menubutton事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    document.addEventListener("menubutton", onMenuKeyDown, false);

}

function onMenuKeyDown() {

    // Handle the back button

}

  

 

 

searchbutton

当用户在android系统上单击“搜索”按钮的时候触发searchbutton事件。

如果需要在android系统上重载默认“搜索”按钮的行为，可以通过注册一个事件监听器来监听searchbutton事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    document.addEventListener("searchbutton", onSearchKeyDown, false);

}

function onSearchKeyDown() {

    // Handle the search button

}

  

 

 

startcallbutton

当用户按下“通话”按钮时会触发startcallbutton事件。

如果需要重写默认的通话行为，可以注册一个监听器用来监听startcallbutton事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    document.addEventListener("startcallbutton", onStartCallKeyDown, false);

}

function onStartCallKeyDown() {

    // Handle the start call button

}

  

 

 

endcallbutton

当用户按下“挂机”按钮时会触发endcallbutton事件。

如果需要重写默认的挂机行为，可以注册一个监听器用来监听endcallbutton事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    document.addEventListener("endcallbutton", onEndCallKeyDown, false);

}

function onEndCallKeyDown() {

    // Handle the end call button

}

 

 

 

volumedownbutton

当用户单击“减小音量”按钮时会触发volumedownbutton事件

如果需要重写默认的减小音量行为，可以注册一个监听器用来监听volumedownbutton事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    document.addEventListener("volumedownbutton", onVolumeDownKeyDown, false);

}

function onVolumeDownKeyDown() {

    // Handle the volume down button

}

 

 

  

volumeupbutton

当用户单击“加大音量”按钮时会触发volumeupbutton事件。

如果需要重写默认的加大音量行为，可以注册一个监听器用来监听volumeupbutton事件。

 

Quick Example

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

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

}

function onVolumeUpKeyDown() {

    // Handle the volume up button

}

  





michael_ouyang
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Cordova 事件简介及代码演示示例
嚜溟的博客
08-20 593
Cordova 事件 Cordova 一共有 个事件 deviceready cordova 加载完成事件 pause 程序进入后台 resume 从后台进入程序 backbutton 按下返回按钮 menubutton 按下菜单按钮 searchbutton 按下搜索按钮 startcallbutton 按下通话按钮 endcallbutton 按下挂断通话按钮 volumedownbutton 按下声音下键按钮 volumeupbutton 按下声音上键按钮 deviceready 当Cordova
Cordova事件
weixin_30247781的博客
04-11 49
1，deviceReady一旦cordova完全加载，事件就会触发。这有助于确保在加载所有内容之前没有调用Cordova函数。 2，pause当应用程序进入后台时触发事件。 3，resume当应用程序从后台返回时，会触发事件。 4，backbutton当按下返回按钮时触发事件。 5，menubutton当按下菜单按钮时触发事件。 6，searchbutton当按下Androi...
cordova中的事件
最新发布
在这个地方会介绍一些前端和后端的开发内容，暂时以JavaEE和Vue为主。
05-21 320
cordova-ondeviceready:在任意时间处理设备就绪事件的小脚本
05-31
这是一个帮助处理cordova deviceready事件的小库。 事件是在document上触发的，当应用程序在事件被触发后使用addEventListener时，这是有问题的。 这个版本可以随时使用，就像$(document).ready(...) 。 安装 bower install cordova - ondeviceready -- save 用法 < script type =" text/javascript " src =" bower_components/cordova-ondeviceready/onCordovaDeviceReady.js " > </ script > < script type =" text/javascript " src =" cordova.js " > </ script > 然后在你的代码中 document . onC
记录addEventListener的用法，以及页面需要调用cordova中遇到的坑
Eno_Lin的博客
07-01 674
addEventListener与deviceready window.document.addEventListener(‘deviceready’, newVue, false);及其坑，虽然是个小问题，deviceready是cordova事件，指定事件名，newVue是当初用来实例化vue的一个函数，它会等待deviceready执行完毕之后才会去实例化，而false为默认值，事件再冒泡阶...
Cordova测试
07-09
5. **事件追踪**：根据需求，调用友盟插件的事件追踪接口，记录用户行为。 6. **数据上报**：确保在合适的时间调用友盟的`startUpload`方法，让统计数据定时上传。 总结，Cordova为开发者提供了一个高效且灵活的跨...
cordova入门
01-27
2. `hooks`：这个目录用于放置自定义脚本，会在特定生命周期事件中执行，但初学者通常不需要深入研究。 3. `node_modules`：存放npm安装的依赖库，版本控制通常会忽略这个目录。 4. `package.json`：描述项目信息和...
cordova_backspace
11-24
在Cordova应用中，由于涉及到与原生环境的交互，这种编辑行为可能会遇到一些挑战，尤其是键盘事件处理方面。 在描述中提到的问题，可能是由于Cordova的WebView（一个用于加载网页内容的组件）与Android系统的输入法...
cordova.7z
01-28
这个 WebView 是每个目标平台（如 Android、iOS）原生的一部分，但 Cordova 添加了额外的功能，如设备 API 访问和生命周期事件处理。 3. **插件系统**: Cordova 的强大之处在于其插件系统。这些插件是连接 WebView ...
cordova显示角标插件
06-12
4. 监听角标变化：此外，插件还提供了监听角标变化的事件，你可以根据需要注册回调函数： ```javascript window.plugin.notification.badge.on('change', function(count) { console.log('Badge count changed to...
cordova实现“再点击一次退出”效果
xxx_v的专栏
04-21 1907
基本的写法如下：  Java代码   document.addEventListener("deviceready", onDeviceReady, false);                  function onDeviceReady() {       //navigator.splashscreen.hide();           document
在vue在js里使用 .addEventListener(‘deviceready‘
qq_42877655的博客
03-20 3353
在js里使用 .addEventListener(‘deviceready’ 在网上查了很多办法 如： window.document.addEventListener('deviceready',function(){ alert("进入window.document.推送环节") },false); window.addEventListener('deviceready',functio...
document.addEventListener理解
热门推荐
提升心智
03-06 3万+
document.addEventListener('自定事件', 处理函数, false); function 某函数(event){             //  方法执行 } addEventListener里最后一个参数决定该事件的响应顺序； 如果为true事件执行顺序为 addEventListener ---- 标签的onclick事件 ---- docume
Cordova事件整理
天马3798
02-21 2545
Cordova事件 Cordova框架了一组事件，开发者用来对某些运行Cordova应用的设备上的事件作出反应。事件处理的一种情况是硬件相关活动，如电池状态变化或用户按了某个物理按钮；另一种情况是应用程序状态的变化，如应用被中止或恢复。这些web应用使用的事件同Native应用使用的是一样的。 完整的支持的事件列表如下： Cordova 事件 描述
cordova入门介绍
qq_41989117的博客
10-26 496
真机调试的配置：https://www.jianshu.com/p/732ffe02a110 cordova详解及介绍：https://blog.csdn.net/a940659387/article/details/49639285 cordova+vue开发APP上手指南：https://www.jianshu.com/p/2e9bebb73d37 1.Cordova是什么？ 一个移动应用开发...
document.addEventListener
weixin_61151047的博客
12-15 1万+
document.addEventListener("事件名称", 函数, false); function 某函数(event){ // 方法执行 } addEventListener里最后一个参数决定该事件的响应顺序； document.addEventListener("事件名称", 函数, true): 如果为true时事件执行顺序为 addEventListener ---- 标签的onclick事件 ---- document.onclick 　 documen...
cordova学习四：事件Events
Jin's blog
06-22 8361
deviceready: 当cordova完全加载，可以调用cordova API接口 支持平台：Amazon、Fire OS、Android、BlackBerry 10、iOS、Tizen、Windows Phone 8、Windows 8 pause: app切换到后台运行时监听的事件，如打开其它应用。 支持平台：Amazon Fire OS、Android、BlackBer
实战指南：Apache Cordova 应用开发
3. **HTML5和Web技术应用**：作者会深入讲解如何利用现代Web技术（如Web Workers、Geolocation、触摸事件等）构建功能丰富的移动应用界面。 4. **插件使用**：书中会重点讲解如何选择、安装和自定义插件，以便扩展...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值