事件类型

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. redis持久化以及集群

    redis提供了两种持久化策略:RDB与AOF RDB RDB的持久化策略: 按照规则定时将内存的数据同步到磁盘 snapshot(按照快照方式完成,当条件符合redis某一种规则,将内存数据写入磁盘 ...

  2. POJ2449 Remmarguts' Date A*算法

    题意是让求从st的ed第k短路... 考虑A*算法:先把终点到每个点最短路跑出来(注意要建反图),当做估价函数h(u),然后跑A* 每次取出总代价最小的,即g(u)+h(u)最小的进行扩展,注意如果u ...

  3. 116th LeetCode Weekly Contest N-Repeated Element in Size 2N Array

    In a array A of size 2N, there are N+1 unique elements, and exactly one of these elements is repeate ...

  4. HDU - 4825 01字典树套路题

    /*H E A D*/ struct Trie{ int son[maxn<<2][2]; int b[67],tot; void init(){ // memset(son,0,size ...

  5. c#工具类之Bitmap缩放帮忙类

    using System.Drawing; using System.Drawing.Drawing2D; /// <summary> /// BitmapHelper /// </ ...

  6. v-model 用在组件中

    官方文档: 使用自定义事件的表单输入组件 官方也说明了,v-model只不过是一个语法糖而已,真正的实现靠的还是 1. v-bind : 绑定响应式数据 2. 触发 input 事件 并传递数据 (核 ...

  7. Oracle列转行函数Listagg以及pivot查询示例

    简单的Oracle列转行函数Listagg示例: CREATE TABLE tbl_test (catalog VARCHAR(1),product VARCHAR(2),amount NUMBER) ...

  8. 【Python】txt数据处理

    实战场景 使用safe3wvs扫描,扫描完成后会在当前目录下生成一个日志文件spider.log,截图如下. 现要求将存在sql注入的url地址整理到spider_new.log文件中,下面分享一个自 ...

  9. sql语句中开窗函数的使用

    开窗函数主要分为2类: 1.排序开窗函数: rank() over(partition by xxx order by yyy) //各分区按照yyy字段排序,如果yyy字段值一样,则rank值一样, ...

  10. 行业UI设计师总结UI设计8个趋势

    纵观整个设计的历史可以发现,设计的历史演变都无一例外都是从复杂的装饰性设计逐步的演化为更加注重功能性的简洁化设计.并且设计师们还在不停的试图通过各种设计语言的创新追求极至设计的可能性.设计潮流变更的核 ...