事件类型

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. 按钮重复点击问题 UIbutton

    .h #import <UIKit/UIKit.h> #import <objc/runtime.h> @interface UIControl (XY) @property ...

  2. flask_restful

    from flask_restful import (Resource, reqparse) # 参数解析对象生成 parser = reqparse.RequestParser() parser.a ...

  3. Android RecyclerView组件和 Spinner(下拉列表框)

    1.RecyclerView <1>知识点介绍 RecyclerView 比 ListView 更高级且更具灵活性. 它是一个用于显示庞大数据集的容器,可通过保持有限数量的视图进行非常有效 ...

  4. C++_基础5-内存模型

    C++为在内存中存储数据提供了多种选择: 可以选择数据保留在内存中的时间长度(存储持续性): 程序的哪一部分可以访问数据(作用域和链接): 可以使用new来动态地分配内存:定位new运算符提供了这种技 ...

  5. Docker Run 设置环境变量

    Docker Run We can then override the environment variables set in the Docker file when running the im ...

  6. 【算法笔记】B1003 我要通过!

    1003 我要通过! (20 分) “答案正确”是自动判题系统给出的最令人欢喜的回复.本题属于 PAT 的“答案正确”大派送 —— 只要读入的字符串满足下列条件,系统就输出“答案正确”,否则输出“答案 ...

  7. Just a Hook(线段树区间修改值)-------------蓝桥备战系列

    In the game of DotA, Pudge's meat hook is actually the most horrible thing for most of the heroes. T ...

  8. 114th LeetCode Weekly Contest Array of Doubled Pairs

    Given an array of integers A with even length, return true if and only if it is possible to reorder ...

  9. 网络安全通信https工作原理

    HTTPS其实是有两部分组成:HTTP + SSL / TLS, 也就是在HTTP上又加了一层处理加密信息的模块.服务端和客户端的信息传输都会通过TLS进行加密,所以传输的数据都是加密后的数据 1. ...

  10. 【研究】Tomcat远程代码执行漏洞(CVE-2017-12615)

    一.Tomcat远程代码执行漏洞(CVE-2017-12615) 1.1       实验环境 操作机:windows 10                         IP:192.168.1. ...