PhoneGap API Events

backbutton
deviceready
menubutton
pause
resume
online
offline
batterycritical
batterylow
batterystatus
volumedownbutton
volumeupbutton

点击下载源代码包

参考代码

<!DOCTYPE html>

<html>

  <head>

    <title>

      PhoneGap Device Ready Example

    </title>

    <link

        href="content/css/themes/default/jquery.mobile.structure-1.4.0-beta.1.min.css"

        rel="stylesheet"

        type="text/css"/>

    <link href="content/css/themes/default/jquery.mobile-1.4.0-beta.1.min.css" rel="stylesheet" type="text/css"/>

    <script src="content/js/jquery.js" type="text/javascript">

    </script>

    <script src="content/js/jquery.mobile-1.4.0-beta.1.js" type="text/javascript">

    </script>

    <script src="content/js/cordova.js" type="text/javascript">

    </script>

    <script type="text/javascript">

      $(function(){

        //当PhoneGap被完全加载后会触发该事件。

        document.addEventListener('deviceready',onDeviceReady,false);

        })

        function onDeviceReady() {

          // 现在可以安全使用PhoneGap API

          //alert('deviceready');

          console.log('deviceready');

          //当PhoneGap应用程序被放到后台的时候触发此事件。

          document.addEventListener('pause', onPause, false);

          //当PhoneGap应用程序被恢复到前台运行的时候触发此事件。

          document.addEventListener('resume', onResume, false);

          //当用户在Android系统上点击后退按钮的时候触发此事件。

          document.addEventListener('backbutton', onBackButton, false);

          //当用户在Android系统上点击菜单按钮的时候触发此事件。

          document.addEventListener('menubutton', onMenuButton, false);

          //当PhoneGap应用程序离线（没有连接到因特网）的时候触发此事件。

          document.addEventListener('offline', isOffline, false);

          //当PhoneGap应用程序在线（连接到因特网）的时候触发此事件。

          document.addEventListener('online', isOnline, false);

          //当PhoneGap应用程序发现电池电量降低到临界点时会触发此事件。

          window.addEventListener('batterycritical', onBatteryCritical, false);

          //当PhoneGap应用程序发现电池降到一个较低水平值时触发此事件。

          window.addEventListener('batterylow', onBatteryLow, false);

          //当PhoneGap应用程序发现电池状态发生改变时触发此事件。

          window.addEventListener('batterystatus', onBatteryStatus, false);

          //当用户按下加大音量按钮时会触发该事件。

          document.addEventListener('volumeupbutton', onVolumeUpKeyDown, false);

        }

        //统计点击数量

        var backbuttoncount=0;

        var menubuttoncount=0;

        var volumeupbuttoncount=0;

        function onPause(){

          console.log('onPause');

        }

        function onResume(){

          console.log('onResume');

        }

        function onBackButton() {

          console.log('onBackButton');

          backbuttoncount++;

          $('#backbuttoncount').text('后退按钮点击'+backbuttoncount+'次');

        }

        function onMenuButton() {

          console.log('onMenuButton');

          menubuttoncount++;

          $('#menubuttoncount').text('菜单按钮点击'+menubuttoncount+'次');

        }

        function isOffline() {

          console.log('Offline');

          $('#ispson').text('没有连接到因特网');

        }

        function isOnline() {

          console.log('isOnline');

          $('#ispson').text('连接到因特网');

        }

        function onBatteryCritical(info) {

          //处理电池电量不足的事件。

          alert("电池电量不足" + info.level + "%");

        }

        function onBatteryLow(info) {

          // 处理电池电量低的事件

          alert("电池电量低 " + info.level + "%");

        }

        function onBatteryStatus(info) {

          // 处理电池状态发生改变的事件

          console.log("电池状态: " + info.level + " 是否充电: " + info.isPlugged);

          $('#batteryinfo').text('电池状态:'  + info.level + '是否充电: '  + info.isPlugged);

        }

        function onVolumeUpKeyDown() {

          // 处理声音增大按钮事件

          console.log('onVolumeUpKeyDown');

          volumeupbuttoncount++;

          $('#volumeupbuttoncount').text('声音增大按钮点击'+volumeupbuttoncount+'次');

        }

      </script>

    </head>

    <body>

      <div data-role="page" id="page">

        <h1>

          Events效果

        </h1>

        <label for="textinput-disabled">

          [后退按钮]:

        </label>

        <a href="#" data-role="button" id="backbuttoncount">

          次数

        </a>

        <label for="textinput-disabled">

          [菜单按钮]:

        </label>

        <a href="#" data-role="button" id="menubuttoncount">

          次数

        </a>

        <label for="textinput-disabled">

          [声音增大按钮]有些平台不支持:

        </label>

        <a href="#" data-role="button" id="volumeupbuttoncount">

          次数

        </a>

        <a href="#" data-role="button" id="batteryinfo">

          电池状态

        </a>

        <a href="#" data-role="button" id="ispson">

          网络连接状态

        </a>

      </div>

    </body>

  </html>

参考中文API文档:http://www.phonegapcn.com/events

声明：本博客高度重视知识产权保护，发现本博客发布的信息包含有侵犯其著作权的链接内容时，请联系我，我将第一时间做相应处理,联系邮箱ffgign@qq.com。

跨平台移动开发_PhoneGap API 事件类型的更多相关文章

  1. 跨平台移动开发_PhoneGap API Camera 使用摄像头采集照片.

    camera对象提供对设备默认摄像头应用程序的访问. 程序运行效果 相关代码 <!DOCTYPE html> <html> <head> <title> ...

  2. 跨平台移动开发_PhoneGap 使用Geolocation基于所在地理位置坐标调用百度地图API

    使用Geolocation基于所在地理位置坐标调用百度地图API 效果图 示例代码 <!DOCTYPE html> <html> <head> <title& ...

  3. 跨平台移动开发_PhoneGap 警告,通知,鸣叫,振动4 种通知类型

    创建鸣叫  使用 confirmation.beep 创建鸣叫 function playBeep() {     navigator.notification.beep(1); } 创建振动  使用 ...

  4. 跨平台移动开发_PhoneGap 再次点击返回键切换到桌面效果

    PhoneGap 再次点击返回键切换到桌面效果 相关代码 <!DOCTYPE html> <html> <head> <title> PhoneGap ...

  5. 跨平台移动开发_PhoneGap 使用Accelerometer 加速器

    使用Accelerometer 加速器效果图 示例代码 <!DOCTYPE html> <html> <head> <title> Cude Phone ...

  6. inux 驱动程序开发中输入子系统总共能产生哪些事件类型（EV_KEY,EV_ABS,EV_REL)

    inux 驱动程序开发中, 输入子系统总共能产生哪些事件类型?,以及分别是什么意思?详见如下: Linux中输入设备的事件类型有EV_SYN 0x00 同步事件EV_KEY 0x01 按键事件,如KE ...

  7. .NET Core 跨平台物联网开发：设置委托事件(二)

    系列教程目录 (一) 连接阿里云IOT (二) 设置委托事件 (三) 上报属性 (四)  SDK文档 属性.方法.委托.类 http://pan.whuanle.cn/index.php?dir=up ...

  8. 全球首个全流程跨平台界面开发套件，PowerUI分析

    一.       首个全流程跨平台界面开发套件,PowerUI正式发布 UIPower在DirectUI的基础上,自主研发全球首个全流程跨平台界面开发套件PowerUI(PUI)正式发布,PowerU ...

  9. 【转贴】-- 基于QT的跨平台应用开发

    原帖地址:http://www.cnblogs.com/R0b1n/p/4106613.html 1 Qt简介 Qt是1991年奇趣科技开发的一个跨平台的C++图形用户界面应用程序框架.它提供给应用程 ...

随机推荐

  1. Spring MVC文件上传教程

    1- 介绍 这篇教程文章是基于 Spring MVC来实现文件的上传功能,这里主要是实现两个功能:1.上传单个文件并将其移动到对应的上传目录:2.一次上传多个文件并将它们存储在指定文件夹下,接下来我们 ...

  2. CentOS下使用MyTop实时监控MySQL

    CentOS下使用MyTop实时监控MySQL MyTop的项目页面为:http://jeremy.zawodny.com/mysql/mytop/ MyTop安装 $ yum -y install ...

  3. Material design之Material Theme

    Material Theme提供了三方面的内容: 系统组件的颜色可以自定义更改 系统组件添加了触摸反馈动画效果 Activity切换动画效果 系统主题默认被定义在以下三个样式中: 使用Material ...

  4. 【动态规划】skiing

    [动态规划]skiing 时间限制: 1 Sec  内存限制: 128 MB提交: 34  解决: 15[提交][状态][讨论版] 题目描述 Michael喜欢滑雪百这并不奇怪, 因为滑雪的确很刺激. ...

  5. JavaWeb关于session生命周期的几种设置方法

    一般session的生命周期都是建立在用户登录系统后对用户信息进行一个记录,session类似于你有一张银行卡,而卡里的钱就是属于session存储的信息,卡掉了就不能取出里面的钱. 以前sessio ...

  6. 《从零开始学Swift》学习笔记（Day 11）——数据类型那些事儿？

    原创文章,欢迎转载.转载请注明:关东升的博客        在我们学习语言时都会学到这种语言的数据类型,在Swift中数据类型有那些呢?整型.浮点型.布尔型.字符.字符串这些类型是一定有的,其中集合. ...

  7. 关于js的当前日期的格式化，和两个日期之间的相减的天数

    function getFormatYMD(timesamp){ var date = new Date(timesamp); Y = date.getFullYear() + '-'; M = (d ...

  8. 学习 《UNIX网络编程》

    学习本书之前,为了了解C语言,先通读了<C程序设计语言>.但对C语言的理解.熟悉可能还是不足,所以在学习本书的过程中,遇到看不懂的C代码,还要去查询.思考. 本书一开始,我就遇到了问题,运 ...

  9. 【转】mysql利用init-connect增加访问审计功能

    mysql的连接首先都是要通过init-connect初始化,然后连接到实例. 我们利用这一点,通过在init-connect的时候记录下用户的thread_id,用户名和用户地址实现db的访问审计功 ...

  10. Servlet 3.0 介绍

    1. 概述 注解代替 web.xml 配置文件 异步处理 对上传的支持 2. 注解代替 web.xml 配置文件 使用方法 在 Servlet 类上添加 @WebServlet(urlPatterns ...