事件类型

backbutton

  • 当用户在Android系统上点击后退按钮的时候触发此事件。
  1. document.addEventListener("backbutton", yourCallbackFunction, false);

详述

  • 如果你需要在Android系统上重载默认后退按钮的行为,可以通过注册一个事件监听器来监听“backbutton”事件。它不再需求调用任何其他方法来重载后退按钮行为,现在你只需要为“backbutton”事件注册一个事件监听器。
  • 通常情况下,你需要在接收到PhoneGap的“deviceready”事件后,使用document.addEventListener来附加该事件监听器。

支持的平台

  • Android

简单的范例

  1. document.addEventListener("backbutton", onBackKeyDown, false);
  2. function onBackKeyDown() {
  3. // 处理后退按钮操作
  4. }

完整的范例

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>PhoneGap Device Ready Example</title>
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
  6. <script type="text/javascript" charset="utf-8">
  7. // 当PhoneGap加载完毕后调用onDeviceReady回调函数
  8. // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。
  9. // 当PhoneGap加载完毕并开始和本地设备进行通讯,
  10. // 会触发“deviceready”事件
  11. document.addEventListener("deviceready", onDeviceReady, false);
  12. // PhoneGap is loaded and it is now safe to make calls PhoneGap methods
  13. function onDeviceReady() {
  14. // 注册回退按钮事件监听器
  15. document.addEventListener("backbutton", onBackKeyDown, false);
  16. }
  17. // 处理后退按钮操作
  18. function onBackKeyDown() {
  19. }
  20. </script>
  21. </head>
  22. <body>
  23. </body>
  24. </html>

deviceready

  • 当PhoneGap被完全加载后会触发该事件。
  1. document.addEventListener("deviceready", yourCallbackFunction, false);

详述

  • 这是每个PhoneGap应用程序都会用到的重要事件。
  • PhoneGap包含两套代码库:本地代码库和JavaScript 代码库。当本地代码加载时会显示一个自定义的加载图片,但是,JavaScript只是在DOM加载后就被加载。这潜在的说明用户的Web应用程序可以在 PhoneGap加载完成之前调用相应的JavaScript函数。
  • PhoneGap一旦完全加载就会触发deviceready事件。当设备触发该事件后,用户就可以安全进行PhoneGap函数调用。
  • 通常情况下,你会希望在HTML文件的DOM加载完毕后使用document.addEventListener附加一个事件监听器。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 5.0或更高版本)
  • iPhone

简单的范例

  1. document.addEventListener("deviceready", onDeviceReady, false);
  2. function onDeviceReady() {
  3. // 现在可以安全使用PhoneGap API
  4. }

完整的范例

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>PhoneGap Device Ready Example</title>
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
  6. <script type="text/javascript" charset="utf-8">
  7. // 当PhoneGap加载完毕后调用onDeviceReady回调函数
  8. // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。
  9. // 当PhoneGap加载完毕并开始和本地设备进行通讯,
  10. // 就会触发“deviceready”事件。
  11. document.addEventListener("deviceready", onDeviceReady, false);
  12. // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法
  13. function onDeviceReady() {
  14. // 现在可以安全使用PhoneGap API
  15. }
  16. </script>
  17. </head>
  18. <body>
  19. </body>
  20. </html>

BlackBerry (OS 4.6) 的特异情况

  • RIM的BrowserField(网页浏览器视图)不支持自定义事件,所以deviceready事件不会被触发。
  • 一种解决方法是一直手动查询PhoneGap.available方法直到PhoneGap完全加载完毕。
  1. function onLoad() {
  2. // BlackBerry OS 4浏览器不支持自定义事件。
  3. // 因此通过手动方式等待,直到PhoneGap加载完毕。
  4. var intervalID = window.setInterval(
  5. function() {
  6. if (PhoneGap.available) {
  7. window.clearInterval(intervalID);
  8. onDeviceReady();
  9. }
  10. },
  11. 500
  12. );
  13. }
  14. function onDeviceReady() {
  15. // 现在可以安全地调用PhoneGap API
  16. }

menubutton

  • 当用户在Android系统上点击菜单按钮的时候触发此事件。
  1. document.addEventListener("menubutton", yourCallbackFunction, false);

详述

  • 如果你需要在Android系统上重载默认菜单按钮的行为,可以通过注册一个事件监听器来监听“menubutton”事件。
  • 通常情况下,你需要在接受到PhoneGap的“deviceready”事件后,使用document.addEventListener来附加该事件监听器。

支持的平台

  • Android

简单的范例

  1. document.addEventListener("menubutton", onMenuKeyDown, false);
  2. function onMenuKeyDown() {
  3. //处理菜单按钮操作
  4. }

完整的范例

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html>
  3. <head>
  4. <title>PhoneGap Device Ready Example</title>
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
  6. <script type="text/javascript" charset="utf-8">
  7. // 当PhoneGap加载完毕后调用onDeviceReady回调函数
  8. // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。
  9. // 当PhoneGap加载完毕并开始和本地设备进行通讯,
  10. // 会触发“deviceready”事件
  11. document.addEventListener("deviceready", onDeviceReady, false);
  12. // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法
  13. function onDeviceReady() {
  14. // 注册菜单按钮事件监听器
  15. document.addEventListener("menubutton", onMenuKeyDown, false);
  16. }
  17. // 处理菜单按钮操作
  18. function onMenuKeyDown() {
  19. }
  20. </script>
  21. </head>
  22. <body onload="onLoad()">
  23. </body>
  24. </html>

pause

  • 当PhoneGap应用程序被放到后台的时候触发此事件。
  1. document.addEventListener("pause", yourCallbackFunction, false);

详述

  • PhoneGap包含两套代码库:本地代码库和JavaScript代码库。当本地代码将应用程序放到后台的时候会触发pause事件。
  • 通常情况下,你会希望一旦接收到PhoneGap的“deviceready”事件就使用document.addEventListener附加一个事件监听器。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 5.0或更高版本)
  • iPhone

简单的范例

  1. document.addEventListener("pause", onPause, false);
  2. function onPause() {
  3. // 处理pause事件
  4. }

完整的范例

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>PhoneGap Device Ready Example</title>
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
  6. <script type="text/javascript" charset="utf-8">
  7. // 当PhoneGap加载完毕后调用onDeviceReady回调函数。
  8. // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。
  9. // 当PhoneGap加载完毕并开始和本地设备进行通讯,
  10. // 就会触发“deviceready”事件。
  11. document.addEventListener("deviceready", onDeviceReady, false);
  12. // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法
  13. function onDeviceReady() {
  14. document.addEventListener("pause", onPause, false);
  15. }
  16. // 处理pause事件
  17. function onPause() {
  18. }
  19. </script>
  20. </head>
  21. <body>
  22. </body>
  23. </html>

iOS的特异情况

  • 在pause事件处理过程中,不但任何通过Objective-C的调用不会工作,而且任何交互性的调用也不会工作,比如警示功能。这意味着你不 能调用console.log(及其变种),且任何来自插件或PhoneGap的API的调用都不会有所反应。这些调用只有在应用程序恢复后才会被处理 (在下一轮运行循环中处理)。

resume

  • 当PhoneGap应用程序被恢复到前台运行的时候触发此事件。
  1. document.addEventListener("resume", yourCallbackFunction, false);

详述

  • PhoneGap包含两套代码库:本地代码库和JaPhoneGap包含两套代码库:本地代码库和JavaScript代码库。当本地代码将应用程序从后台提取到前台运行的时候触发resume事件。
  • 通常情况下,你会希望一旦接收到PhoneGap的“deviceready”事件就使用document.addEventListener附加一个事件监听器。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 5.0或更高版本)
  • iPhone

简单的范例

  1. document.addEventListener("resume", onResume, false);
  2. function onResume() {
  3. // 处理resume事件
  4. }

完整的范例

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>PhoneGap Device Ready Example</title>
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
  6. <script type="text/javascript" charset="utf-8">
  7. // 当PhoneGap加载完毕后调用onDeviceReady回调函数。
  8. // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。
  9. // 当PhoneGap加载完毕并开始和本地设备进行通讯,
  10. // 就会触发“deviceready”事件。
  11. document.addEventListener("deviceready", onDeviceReady, false);
  12. // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法。
  13. function onDeviceReady() {
  14. document.addEventListener("resume", onResume, false);
  15. }
  16. // 处理resume事件
  17. function onResume() {
  18. }
  19. </script>
  20. </head>
  21. <body>
  22. </body>
  23. </html>

online

  • 当PhoneGap应用程序在线(连接到因特网)的时候触发此事件。
  1. document.addEventListener("online", yourCallbackFunction, false);

详述

  • 当应用程序的网络连接改变为online的时候触发online事件。
  • 通常情况下,你会希望一旦接收到PhoneGap的“deviceready”事件就使用document.addEventListener附加一个事件监听器。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 5.0或更高版本)
  • iPhone

简单的范例

  1. document.addEventListener("online", onOnline, false);
  2. function onOnline() {
  3. // 处理online事件
  4. }

完整的范例

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>PhoneGap Device Ready Example</title>
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
  6. <script type="text/javascript" charset="utf-8">
  7. // 当PhoneGap加载完毕后调用onDeviceReady回调函数。
  8. // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。
  9. // 当PhoneGap加载完毕并开始和本地设备进行通讯,
  10. // 就会触发“deviceready”事件。
  11. document.addEventListener("deviceready", onDeviceReady, false);
  12. // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法。
  13. function onDeviceReady() {
  14. document.addEventListener("online", onOnline, false);
  15. }
  16. // 处理online事件
  17. function onOnline() {
  18. }
  19. </script>
  20. </head>
  21. <body>
  22. </body>
  23. </html>

iOS的特异情况

  • 在初次启动的情况下,第一个online事件(如果有的话)将需要至少1秒钟才被触发。

offline

  • 当PhoneGap应用程序离线(没有连接到因特网)的时候触发此事件。
  1. document.addEventListener("offline", yourCallbackFunction, false);

详述

  • 当应用程序的网络连接改变为offline的时候触发offline事件。
  • 通常情况下,你会希望一旦接收到PhoneGap的“deviceready”事件就使用document.addEventListener附加一个事件监听器。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 5.0或更高版本)
  • iPhone

简单的范例

  1. document.addEventListener("offline", onOffline, false);
  2. function onOffline() {
  3. // 处理offline事件
  4. }

完整的范例

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>PhoneGap Device Ready Example</title>
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
  6. <script type="text/javascript" charset="utf-8">
  7. // 当PhoneGap加载完毕后调用onDeviceReady回调函数
  8. // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。
  9. // 当PhoneGap加载完毕并开始和本地设备进行通讯,
  10. // 就会触发“deviceready”事件。
  11. document.addEventListener("deviceready", onDeviceReady, false);
  12. // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法。
  13. function onDeviceReady() {
  14. document.addEventListener("offline", onOffline, false);
  15. }
  16. // 处理offline事件
  17. function onOffline() {
  18. }
  19. </script>
  20. </head>
  21. <body>
  22. </body>
  23. </html>

iOS的特异情况

  • 在初次启动的情况下,第一个offline事件(如果有的话)将需要至少1秒钟才被触发。

Searchbutton

  • 当用户在Android系统上点击搜索按钮的时候触发该事件。
  1. document.addEventListener("searchbutton", yourCallbackFunction, false);

详述

  • 如果你需要在Android系统上重载默认搜索按钮的行为,可以通过注册一个事件监听器来监听“searchbutton”事件。
  • 通常情况下,你需要在接受到PhoneGap的“deviceready”事件后,使用document.addEventListener来附加该事件监听器。

支持的平台

  • Android

简单的范例

  1. document.addEventListener("searchbutton", onSearchKeyDown, false);
  2. function onSearchKeyDown() {
  3. // 处理搜索按钮操作
  4. }

完整的范例

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html>
  3. <head>
  4. <title>PhoneGap Device Ready Example</title>
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
  6. <script type="text/javascript" charset="utf-8">
  7. // 当PhoneGap加载完毕后调用onDeviceReady回调函数。
  8. // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。
  9. // 当PhoneGap加载完毕并开始和本地设备进行通讯,
  10. // 会触发“deviceready”事件。
  11. document.addEventListener("deviceready", onDeviceReady, false);
  12. // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法
  13. function onDeviceReady() {
  14. // 注册搜索按钮事件监听器
  15. document.addEventListener("searchbutton", onSearchKeyDown, false);
  16. }
  17. // 处理搜索按钮操作
  18. function onSearchKeyDown() {
  19. }
  20. </script>
  21. </head>
  22. <body onload="onLoad()">
  23. </body>
  24. </html>

PhoneGap API介绍:Events的更多相关文章

  1. PhoneGap学习地址 / PhoneGap API介绍:Events

    http://blog.csdn.net/phonegapcn 事件类型: backbutton deviceready menubutton pause resume searchbutton on ...

  2. PhoneGap API介绍:Camera

    本文将介绍PhoneGap API——Camera:使用设备的摄像头采集照片,对象提供对设备默认摄像头应用程序的访问. 方法: camera.getPicture 参数: cameraSuccess ...

  3. PhoneGap API介绍:File

    本文将介绍PhoneGap API——File:通过JavaScript截获本地文件系统.File是用于读取.写入和浏览文件系统层次结构的PhoneGap API. 对象: DirectoryEntr ...

  4. PhoneGap API 之多媒体

    一. MediaApi 简单介绍 PhoneGap API Media 对象提供录制和回放设备上的音频文件的能力 参数: var media = new Media(src, mediaSuccess ...

  5. 常用ArcGIS for Silverlight 开发API介绍

    1.API介绍 2.Map对象  3.Layer对象 4.Symbol对象 5.Task对象

  6. Servlet基础(一) Servlet简介 关键API介绍及结合源码讲解

    Servlet基础(一) Servlet基础和关键的API介绍 Servlet简介 Java Servlet是和平台无关的服务器端组件,它运行在Servlet容器中. Servlet容器负责Servl ...

  7. python学习笔记(win32print API介绍)

    最近博主在研究用python控制打印机 这里整理下win32print的API介绍,官网地址http://timgolden.me.uk/pywin32-docs/win32print.html Op ...

  8. 使用html5中video自定义播放器必备知识点总结以及JS全屏API介绍

    一.video的js知识点: controls(控制器).autoplay(自动播放).loop(循环)==video默认的: 自定义播放器中一些JS中提供的方法和属性的记录: 1.play()控制视 ...

  9. facebook api介绍

    转自(http://sls.weco.net/node/10773) 一.Facebook API 基礎概念 Facebook API 概論 : API 最大的好處在於可以讓程式開發人員只需要根據 A ...

随机推荐

  1. Python中的if __name__ == '__main__'

    如何简单地理解Python中的if __name__ == '__main__'   1. 摘要 通俗的理解__name__ == '__main__':假如你叫小明.py,在朋友眼中,你是小明(__ ...

  2. Python和qqbot库开发简单的机器人

    from qqbot import QQBotSlot as qqbotslot, RunBot @qqbotslot def onQQMessage(bot, contact, member, co ...

  3. opencv基本操作

    src.convertTo(dst, type, scale, shift) 缩放并转换到另外一种数据类型: dst:目的矩阵 type:需要的输出矩阵类型,或者更明确的,是输出矩阵的深度,如果是负值 ...

  4. linux环境下安装python

    在linux系统中安装python解释器 打开官网www.python.org 选择合适的版本进行下载 将下载好的压缩包拖入Xshell中,依次输入一下命令即可 tar xf Python-.tar. ...

  5. Java打包成jar

    若要生成一个名为 cal.jar 的可执行jar文件:(文件名可以是任意合法名字)  (这是我认为简单实用的一种方法,还有很多别的方法在此就不介绍了)  第一 把程序生成的所有字节码文件(即.clas ...

  6. 【网络】CCNA实验一:Vlan、Trunk

    要求: 1:不同楼层物理隔离,但逻辑相连 2:相同楼层物理相连,但逻辑隔离 3:主机可以动态获取IP地址 4:不同VLAN间可以进行通信 5:主机最终访问www.esafenet.com弹出" ...

  7. 解决nginx文件服务器访问403

    2018-10-24 nginx配置文件目录服务器 修改/etc/nginx/conf.d/default.conf或者在/etc/nginx/conf.d/目录下添加一配置文件,如下 server ...

  8. vue 的计算属性computed自我理解

    类型:{ [key: string]: Function | { get: Function, set: Function } } 计算属性的结果会被缓存,除非依赖的响应式属性变化才会重新计算.注意, ...

  9. 【Tensorflow】 Object_detection之训练PASCAL VOC数据集

    参考:Running Locally 1.检查数据.config文件是否配置好 可参考之前博客: Tensorflow Object_detection之配置Training Pipeline Ten ...

  10. 第十五章:集成JPUSH

    如果不想自己搭建push server,则可以借助于第三方的api来实现push的功能,本文主要介绍ionic如何集成jpush. 具体步骤如下: 创建ionic应用:ionic_jpush. 申请j ...