立即注册 登录
PhoneGap中文网 返回首页

niexiangli的个人空间 http://www.phonegap100.com/?6884 [收藏] [复制] [RSS]

日志

PhoneGap API帮助文档翻译—Events(事件)

已有 1314 次阅读2014-4-14 16:05 |个人分类:分享日志


PhoneGap整个生命周期内触发的事件。
事件类型:
  • backbutton
  • deviceready
  • menubutton
  • pause
  • resume
  • searchbutton
  • online
  • offline
backbutton 
 
当用户在Android系统上点击后退按钮的时候触发此事件。
  1. document.addEventListener("backbutton", yourCallbackFunction, false);  
详述:
如果你需要在Android系统上重载默认后退按钮的行为,可以通过注册一个事件监听器来监听“backbutton”事件。它不再需求调用任何其他方法来重载后退按钮行为,现在你只需要为“backbutton”事件注册一个事件监听器。
通常情况下,你需要在接收到PhoneGap的“deviceready”事件后,使用document.addEventListener来附加该事件监听器。
支持的平台:
  • Android
简单的范例:
  1. document.addEventListener("backbutton", onBackKeyDown, false);  
  2.       
  3. function onBackKeyDown() {  
  4.    // 处理后退按钮操作  
  5. }  
完整的范例:
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>      
  4. <title>PhoneGap Device Ready Example</title>  
  5.   
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>  
  7. <script type="text/javascript" charset="utf-8">  
  8.   
  9.     // 当PhoneGap加载完毕后调用onDeviceReady回调函数   
  10.     // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。  
  11.     // 当PhoneGap加载完毕并开始和本地设备进行通讯,  
  12.     // 会触发“deviceready”事件  
  13.     document.addEventListener("deviceready", onDeviceReady, false);  
  14.       
  15.     // PhoneGap is loaded and it is now safe to make calls PhoneGap methods  
  16.     function onDeviceReady() {  
  17.         // 注册回退按钮事件监听器  
  18.         document.addEventListener("backbutton", onBackKeyDown, false);  
  19.     }  
  20.       
  21.     // 处理后退按钮操作  
  22.     function onBackKeyDown() {  
  23.     }  
  24.   
  25. </script>  
  26. </head>  
  27. <body>  
  28. </body>  
  29. </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.   
  3. function onDeviceReady() {  
  4.     // 现在可以安全使用PhoneGap API   
  5. }  
完整的范例:
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>      
  4. <title>PhoneGap Device Ready Example</title>  
  5.   
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>  
  7. <script type="text/javascript" charset="utf-8">  
  8.   
  9.     // 当PhoneGap加载完毕后调用onDeviceReady回调函数  
  10.     // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。  
  11.     // 当PhoneGap加载完毕并开始和本地设备进行通讯,  
  12.     // 就会触发“deviceready”事件。  
  13.     document.addEventListener("deviceready", onDeviceReady, false);  
  14.       
  15.     // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法  
  16.     function onDeviceReady() {  
  17.        // 现在可以安全使用PhoneGap API  
  18.     }  
  19.   
  20. </script>  
  21. </head>  
  22. <body>  
  23. </body>  
  24. </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.   
  15. function onDeviceReady() {  
  16.     // 现在可以安全地调用PhoneGap API  
  17. }  
menubutton 
 
当用户在Android系统上点击菜单按钮的时候触发此事件。
  1. document.addEventListener("menubutton", yourCallbackFunction, false);  
详述:
如果你需要在Android系统上重载默认菜单按钮的行为,可以通过注册一个事件监听器来监听“menubutton”事件。
通常情况下,你需要在接受到PhoneGap的“deviceready”事件后,使用document.addEventListener来附加该事件监听器。
支持的平台:
  • Android
简单的范例:
  1. document.addEventListener("menubutton", onMenuKeyDown, false);   
  2.    
  3. function onMenuKeyDown() {   
  4.     //处理菜单按钮操作   
  5. }  
完整的范例:
  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.   
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>   
  7. <script type="text/javascript" charset="utf-8">   
  8.   
  9.     // 当PhoneGap加载完毕后调用onDeviceReady回调函数  
  10.     // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。  
  11.     // 当PhoneGap加载完毕并开始和本地设备进行通讯,  
  12.     // 会触发“deviceready”事件  
  13.     document.addEventListener("deviceready", onDeviceReady, false);   
  14.       
  15.     // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法  
  16.     function onDeviceReady() {   
  17.         // 注册菜单按钮事件监听器  
  18.         document.addEventListener("menubutton", onMenuKeyDown, false);   
  19.     }   
  20.       
  21.     // 处理菜单按钮操作  
  22.     function onMenuKeyDown() {   
  23.     }   
  24.   
  25. </script>  
  26. </head>  
  27. <body onload="onLoad()">  
  28. </body>  
  29. </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.   
  3. function onPause() {  
  4.    // 处理pause事件  
  5. }  
完整的范例:
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>      
  4. <title>PhoneGap Device Ready Example</title>  
  5.   
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>  
  7. <script type="text/javascript" charset="utf-8">  
  8.       
  9.     // 当PhoneGap加载完毕后调用onDeviceReady回调函数。  
  10.     // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。  
  11.     // 当PhoneGap加载完毕并开始和本地设备进行通讯,  
  12.     // 就会触发“deviceready”事件。  
  13.     document.addEventListener("deviceready", onDeviceReady, false);  
  14.       
  15.     // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法  
  16.     function onDeviceReady() {  
  17.         document.addEventListener("pause", onPause, false);  
  18.     }  
  19.       
  20.     // 处理pause事件  
  21.     function onPause() {  
  22.     }  
  23.   
  24. </script>  
  25. </head>  
  26. <body>  
  27. </body>  
  28. </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.   
  3. function onResume() {  
  4.    // 处理resume事件  
  5. }  
完整的范例:
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>      
  4. <title>PhoneGap Device Ready Example</title>  
  5.   
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>  
  7. <script type="text/javascript" charset="utf-8">  
  8.   
  9.     // 当PhoneGap加载完毕后调用onDeviceReady回调函数。  
  10.     // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。  
  11.     // 当PhoneGap加载完毕并开始和本地设备进行通讯,  
  12.     // 就会触发“deviceready”事件。  
  13.     document.addEventListener("deviceready", onDeviceReady, false);  
  14.       
  15.     // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法。  
  16.     function onDeviceReady() {  
  17.         document.addEventListener("resume", onResume, false);  
  18.     }  
  19.       
  20.     // 处理resume事件  
  21.     function onResume() {  
  22.     }  
  23.       
  24. </script>  
  25. </head>  
  26. <body>  
  27. </body>  
  28. </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.    
  3. function onOnline() {  
  4.     // 处理online事件  
  5. }  
完整的范例:
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>      
  4. <title>PhoneGap Device Ready Example</title>   
  5.   
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>   
  7. <script type="text/javascript" charset="utf-8">   
  8.   
  9.     // 当PhoneGap加载完毕后调用onDeviceReady回调函数。  
  10.     // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。  
  11.     // 当PhoneGap加载完毕并开始和本地设备进行通讯,  
  12.       // 就会触发“deviceready”事件。  
  13.     document.addEventListener("deviceready", onDeviceReady, false);   
  14.       
  15.     // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法。  
  16.     function onDeviceReady() {   
  17.         document.addEventListener("online", onOnline, false);   
  18.     }   
  19.       
  20.     // 处理online事件   
  21.     function onOnline() {   
  22.     }   
  23.   
  24. </script>  
  25. </head>  
  26. <body>  
  27. </body>  
  28. </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.    
  3. function onOffline() {  
  4.     // 处理offline事件   
  5. }  
完整的范例:
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>      
  4. <title>PhoneGap Device Ready Example</title>   
  5.   
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>   
  7. <script type="text/javascript" charset="utf-8">   
  8.   
  9.     // 当PhoneGap加载完毕后调用onDeviceReady回调函数  
  10.     // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。  
  11.     // 当PhoneGap加载完毕并开始和本地设备进行通讯,  
  12.       // 就会触发“deviceready”事件。  
  13.     document.addEventListener("deviceready", onDeviceReady, false);   
  14.       
  15.     // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法。  
  16.     function onDeviceReady() {   
  17.         document.addEventListener("offline", onOffline, false);   
  18.     }   
  19.       
  20.     // 处理offline事件  
  21.     function onOffline() {   
  22.     }   
  23.   
  24. </script>  
  25. </head>  
  26. <body>  
  27. </body>  
  28. </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.    
  3. function onSearchKeyDown() {  
  4.     // 处理搜索按钮操作  
  5. }  
完整的范例:
  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.   
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>   
  7. <script type="text/javascript" charset="utf-8">   
  8.   
  9.     // 当PhoneGap加载完毕后调用onDeviceReady回调函数。  
  10.     // 此时,该文件已加载完毕但phonegap.js还没有加载完毕。  
  11.     // 当PhoneGap加载完毕并开始和本地设备进行通讯,  
  12.     // 会触发“deviceready”事件。   
  13.     document.addEventListener("deviceready", onDeviceReady, false);    
  14.       
  15.     // PhoneGap加载完毕,现在可以安全地调用PhoneGap方法   
  16.     function onDeviceReady() {   
  17.         // 注册搜索按钮事件监听器  
  18.         document.addEventListener("searchbutton", onSearchKeyDown, false);   
  19.     }   
  20.       
  21.     // 处理搜索按钮操作  
  22.     function onSearchKeyDown() {   
  23.     }   
  24.   
  25. </script>  
  26. </head>  
  27. <body onload="onLoad()">  
  28. </body>  
  29. </html>  

头晕

不解

扯淡

搞笑

欠扁

超赞

支持

难过

评论 (0 个评论)

facelist

您需要登录后才可以评论 登录 | 立即注册

关闭

站长推荐 上一条 /1 下一条

ionic4视频教程

Archiver|手机版|小黑屋| PhoneGap中文网 ( 京ICP备13027796号-1 )  

GMT+8, 2024-5-5 23:34 , Processed in 0.039234 second(s), 22 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

返回顶部