PhoneGap API介紹：Events

時間  2019-11-05
標籤 phonegap api 介紹 events 简体版
原文   原文鏈接

事件類型：javascript

backbuttoncode

  • 當用戶在Android系統上點擊後退按鈕的時候觸發此事件。

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

詳述：

  • 若是你須要在Android系統上重載默認後退按鈕的行爲，能夠經過註冊一個事件監聽器來監聽「backbutton」事件。它再也不需求調用任何其餘方法來重載後退按鈕行爲，如今你只須要爲「backbutton」事件註冊一個事件監聽器。

  • 一般狀況下，你須要在接收到PhoneGap的「deviceready」事件後，使用document.addEventListener來附加該事件監聽器。

支持的平臺：

  • Android

簡單的範例：

document.addEventListener("backbutton", onBackKeyDown, false);      function onBackKeyDown() {    // 處理後退按鈕操做 }

完整的範例：

<!DOCTYPE html> <html> <head>     <title>PhoneGap Device Ready Example</title>  <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8">      // 當PhoneGap加載完畢後調用onDeviceReady回調函數     // 此時，該文件已加載完畢但phonegap.js尚未加載完畢。     // 當PhoneGap加載完畢並開始和本地設備進行通信，     // 會觸發「deviceready」事件     document.addEventListener("deviceready", onDeviceReady, false);          // PhoneGap is loaded and it is now safe to make calls PhoneGap methods     function onDeviceReady() {         // 註冊回退按鈕事件監聽器            document.addEventListener("backbutton", onBackKeyDown, false);     }          // 處理後退按鈕操做     function onBackKeyDown() {     }  </script> </head> <body> </body> </html>

deviceready

  • 當PhoneGap被徹底加載後會觸發該事件。

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

簡單的範例：

document.addEventListener("deviceready", onDeviceReady, false);  function onDeviceReady() {     // 如今能夠安全使用PhoneGap API }

完整的範例：

<!DOCTYPE html> <html> <head>     <title>PhoneGap Device Ready Example</title>  <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8">      // 當PhoneGap加載完畢後調用onDeviceReady回調函數     // 此時，該文件已加載完畢但phonegap.js尚未加載完畢。     // 當PhoneGap加載完畢並開始和本地設備進行通信，     // 就會觸發「deviceready」事件。     document.addEventListener("deviceready", onDeviceReady, false);          // PhoneGap加載完畢，如今能夠安全地調用PhoneGap方法     function onDeviceReady() {        // 如今能夠安全使用PhoneGap API     }  </script> </head> <body> </body> </html>

BlackBerry (OS 4.6) 的特異狀況：

  • RIM的BrowserField(網頁瀏覽器視圖)不支持自定義事件，因此deviceready事件不會被觸發。

  • 一種解決方法是一直手動查詢PhoneGap.available方法直到PhoneGap徹底加載完畢。

function onLoad() {     // BlackBerry OS 4瀏覽器不支持自定義事件。     // 所以經過手動方式等待，直到PhoneGap加載完畢。     var intervalID = window.setInterval(         function() {              if (PhoneGap.available) {              window.clearInterval(intervalID);              onDeviceReady();          }      },      500     ); }  function onDeviceReady() {     // 如今能夠安全地調用PhoneGap API }

menubutton

  • 當用戶在Android系統上點擊菜單按鈕的時候觸發此事件。

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

詳述：

  • 若是你須要在Android系統上重載默認菜單按鈕的行爲，能夠經過註冊一個事件監聽器來監聽「menubutton」事件。

  • 一般狀況下，你須要在接受到PhoneGap的「deviceready」事件後，使用document.addEventListener來附加該事件監聽器。

支持的平臺：

  • Android

簡單的範例：

document.addEventListener("menubutton", onMenuKeyDown, false);   function onMenuKeyDown() {     //處理菜單按鈕操做 }

完整的範例：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head>     <title>PhoneGap Device Ready Example</title>  <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8">      // 當PhoneGap加載完畢後調用onDeviceReady回調函數     // 此時，該文件已加載完畢但phonegap.js尚未加載完畢。     // 當PhoneGap加載完畢並開始和本地設備進行通信，     // 會觸發「deviceready」事件     document.addEventListener("deviceready", onDeviceReady, false);          // PhoneGap加載完畢，如今能夠安全地調用PhoneGap方法     function onDeviceReady() {         // 註冊菜單按鈕事件監聽器         document.addEventListener("menubutton", onMenuKeyDown, false);     }          // 處理菜單按鈕操做     function onMenuKeyDown() {     }  </script> </head> <body onload="onLoad()"> </body> </html>

pause

  • 當PhoneGap應用程序被放到後臺的時候觸發此事件。

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

詳述：

  • PhoneGap包含兩套代碼庫：本地代碼庫和JavaScript代碼庫。當本地代碼將應用程序放到後臺的時候會觸發pause事件。

  • 一般狀況下，你會但願一旦接收到PhoneGap的「deviceready」事件就使用document.addEventListener附加一個事件監聽器。

支持的平臺：

  • Android

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

  • iPhone

簡單的範例：

document.addEventListener("pause", onPause, false);  function onPause() {    // 處理pause事件 }

完整的範例：

<!DOCTYPE html> <html> <head>     <title>PhoneGap Device Ready Example</title>  <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8">          // 當PhoneGap加載完畢後調用onDeviceReady回調函數。     // 此時，該文件已加載完畢但phonegap.js尚未加載完畢。     // 當PhoneGap加載完畢並開始和本地設備進行通信，     // 就會觸發「deviceready」事件。     document.addEventListener("deviceready", onDeviceReady, false);          // PhoneGap加載完畢，如今能夠安全地調用PhoneGap方法     function onDeviceReady() {         document.addEventListener("pause", onPause, false);     }          // 處理pause事件     function onPause() {     }  </script> </head> <body> </body> </html>

iOS的特異狀況：

  • 在pause事件處理過程當中，不但任何經過Objective-C的調用不會工做，並且任何交互性的調用也不會工做，好比警示功能。這意味着你不能調用console.log(及其變種)，且任何來自插件或PhoneGap的API的調用都不會有所反應。這些調用只有在應用程序恢復後纔會被處理（在下一輪運行循環中處理）。

resume

  • 當PhoneGap應用程序被恢復到前臺運行的時候觸發此事件。

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

詳述：

  • PhoneGap包含兩套代碼庫：本地代碼庫和JaPhoneGap包含兩套代碼庫：本地代碼庫和JavaScript代碼庫。當本地代碼將應用程序從後臺提取到前臺運行的時候觸發resume事件。

  • 一般狀況下，你會但願一旦接收到PhoneGap的「deviceready」事件就使用document.addEventListener附加一個事件監聽器。

支持的平臺：

  • Android

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

  • iPhone

簡單的範例：

document.addEventListener("resume", onResume, false);  function onResume() {    // 處理resume事件 }

完整的範例：

<!DOCTYPE html> <html> <head>     <title>PhoneGap Device Ready Example</title>  <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8">      // 當PhoneGap加載完畢後調用onDeviceReady回調函數。     // 此時，該文件已加載完畢但phonegap.js尚未加載完畢。     // 當PhoneGap加載完畢並開始和本地設備進行通信，     // 就會觸發「deviceready」事件。     document.addEventListener("deviceready", onDeviceReady, false);          // PhoneGap加載完畢，如今能夠安全地調用PhoneGap方法。     function onDeviceReady() {         document.addEventListener("resume", onResume, false);     }          // 處理resume事件     function onResume() {     }      </script> </head> <body> </body> </html>

online

  • 當PhoneGap應用程序在線（鏈接到因特網）的時候觸發此事件。

document.addEventListener("online", yourCallbackFunction, false);

詳述：

  • 當應用程序的網絡鏈接改變爲online的時候觸發online事件。

  • 一般狀況下，你會但願一旦接收到PhoneGap的「deviceready」事件就使用document.addEventListener附加一個事件監聽器。

支持的平臺：

  • Android

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

  • iPhone

簡單的範例：

document.addEventListener("online", onOnline, false);   function onOnline() {     // 處理online事件 }

完整的範例：

<!DOCTYPE html> <html> <head>     <title>PhoneGap Device Ready Example</title>  <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8">      // 當PhoneGap加載完畢後調用onDeviceReady回調函數。     // 此時，該文件已加載完畢但phonegap.js尚未加載完畢。     // 當PhoneGap加載完畢並開始和本地設備進行通信，       // 就會觸發「deviceready」事件。     document.addEventListener("deviceready", onDeviceReady, false);          // PhoneGap加載完畢，如今能夠安全地調用PhoneGap方法。     function onDeviceReady() {         document.addEventListener("online", onOnline, false);     }          // 處理online事件     function onOnline() {     }  </script> </head> <body> </body> </html>

iOS的特異狀況：

  • 在初次啓動的狀況下，第一個online事件（若是有的話）將須要至少1秒鐘才被觸發。

offline

  • 當PhoneGap應用程序離線（沒有鏈接到因特網）的時候觸發此事件。

document.addEventListener("offline", yourCallbackFunction, false);

詳述：

  • 當應用程序的網絡鏈接改變爲offline的時候觸發offline事件。

  • 一般狀況下，你會但願一旦接收到PhoneGap的「deviceready」事件就使用document.addEventListener附加一個事件監聽器。

支持的平臺：

  • Android

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

  • iPhone

簡單的範例：

document.addEventListener("offline", onOffline, false);   function onOffline() {     // 處理offline事件 }

完整的範例：

<!DOCTYPE html> <html> <head>     <title>PhoneGap Device Ready Example</title>  <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8">      // 當PhoneGap加載完畢後調用onDeviceReady回調函數     // 此時，該文件已加載完畢但phonegap.js尚未加載完畢。     // 當PhoneGap加載完畢並開始和本地設備進行通信，       // 就會觸發「deviceready」事件。     document.addEventListener("deviceready", onDeviceReady, false);          // PhoneGap加載完畢，如今能夠安全地調用PhoneGap方法。     function onDeviceReady() {         document.addEventListener("offline", onOffline, false);     }          // 處理offline事件     function onOffline() {     }  </script> </head> <body> </body> </html>

iOS的特異狀況：

  • 在初次啓動的狀況下，第一個offline事件（若是有的話）將須要至少1秒鐘才被觸發。

Searchbutton

  • 當用戶在Android系統上點擊搜索按鈕的時候觸發該事件。

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

詳述：

  • 若是你須要在Android系統上重載默認搜索按鈕的行爲，能夠經過註冊一個事件監聽器來監聽「searchbutton」事件。

  • 一般狀況下，你須要在接受到PhoneGap的「deviceready」事件後，使用document.addEventListener來附加該事件監聽器。

支持的平臺：

  • Android

簡單的範例：

document.addEventListener("searchbutton", onSearchKeyDown, false);   function onSearchKeyDown() {     // 處理搜索按鈕操做 }

完整的範例：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head>     <title>PhoneGap Device Ready Example</title>  <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8">      // 當PhoneGap加載完畢後調用onDeviceReady回調函數。     // 此時，該文件已加載完畢但phonegap.js尚未加載完畢。     // 當PhoneGap加載完畢並開始和本地設備進行通信，     // 會觸發「deviceready」事件。     document.addEventListener("deviceready", onDeviceReady, false);            // PhoneGap加載完畢，如今能夠安全地調用PhoneGap方法     function onDeviceReady() {         // 註冊搜索按鈕事件監聽器         document.addEventListener("searchbutton", onSearchKeyDown, false);     }          // 處理搜索按鈕操做     function onSearchKeyDown() {     }  </script> </head> <body onload="onLoad()"> </body> </html>
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程