使用phonegap播放音频的实现方法


Posted in HTML / CSS onMarch 31, 2017

实例如下:

<!DOCTYPE html> 
<html> 
  
    <head> 
        <meta charset="UTF-8"> 
        <title>Compass Example</title> 
  
        <script type="text/javascript" charset="UTF-8" src="cordova.js"></script> 
        <script type="text/javascript" charset="UTF-8"> 
            document.addEventListener("deviceready", onDeviceReady, false); 
  
            function onDeviceReady() { 
            } 
              
            var my_media=null; 
            var mediaTimer=null; 
              
            function playAudio(src){ 
                my_media=new Media(src,onSuccess,onError); 
                my_media.play(); 
                  
                if(mediaTimer==null){ 
                    mediaTimer=setInterval(function(){ 
                        my_media.getCurrentPosition( 
                            //成功回调 
                            function(position){ 
                            if(position>-1){ 
                                setAudioPosition((position/1000)+"sec"); 
                            } 
                        }, 
                        //错误回调 
                        function (e){ 
                            console.log("Error getting pos="+e); 
                            setAudioPosition("Error: "+e); 
                        } 
                        ); 
                    },1000); 
                } 
            } 
              
            function pauseAudio(){ 
                if(my_media){ 
                    my_media.pause(); 
                } 
            } 
              
            function stopAudio(){ 
                if(my_media){ 
                    my_media.stopAudio(); 
                } 
                clearInterval(mediaTimer); 
                mediaTimer=null; 
            } 
              
            function onSuccess(){ 
                console.log("playAudio():Audio Success"); 
            } 
              
            function setAudioPosition(position){ 
                document.getElementById('audio_position').innerHTML=position; 
            } 
  
            //错误的回调  
            function onError(error) { 
                alert('code:'+error.code+'\n'+'message:'+error.message+'\n'); 
            } 
              
        </script> 
    </head> 
  
    <body> 
        <a href="#" onclick="playAudio('http://example.com/audio.mp3');">Play Audio</a> 
        <a href="#" onclick="pauseAudio();">Pause Playing Audio</a> 
        <a href="#" onclick="stopAudio();">Stop Playing Audio</a> 
        <p id="audio_position"></p> 
    </body> 
  
</html>

以上这篇使用phonegap播放音频的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

HTML / CSS 相关文章推荐
手把手教你用纯css3实现轮播图效果实例
May 04 HTML / CSS
CSS3的新特性介绍
Oct 31 HTML / CSS
CSS3教程(5):网页背景图片
Apr 02 HTML / CSS
css3弹性盒模型(Flexbox)详细介绍
Oct 08 HTML / CSS
详解CSS3新增的背景属性
Dec 25 HTML / CSS
html5 touch事件实现触屏页面上下滑动(二)
Mar 10 HTML / CSS
html5适合移动应用开发的12大特性
Mar 19 HTML / CSS
12个不为大家熟知的HTML5设计小技巧
Jun 02 HTML / CSS
canvas与html5实现视频截图功能示例
Dec 15 HTML / CSS
H5页面适配iPhoneX(就是那么简单)
Dec 02 HTML / CSS
为什么你写的height:100%不起作用
May 10 HTML / CSS
css3新特性的应用示例分析
Mar 16 HTML / CSS
使用phonegap获取位置信息的实现方法
Mar 31 #HTML / CSS
使用phonegap操作数据库的实现方法
Mar 31 #HTML / CSS
使用phonegap进行本地存储的实现方法
Mar 31 #HTML / CSS
使用phonegap创建联系人的实现方法
Mar 30 #HTML / CSS
使用phonegap进行提示操作的具体方法
Mar 30 #HTML / CSS
详解HTML5之pushstate、popstate操作history,无刷新改变当前url
Mar 15 #HTML / CSS
HTML5无刷新改变当前url的代码
Mar 15 #HTML / CSS
You might like
PHP 登录记住密码实现思路
2013/05/07 PHP
php中读写文件与读写数据库的效率比较分享
2013/10/19 PHP
又一个PHP实现的冒泡排序算法分享
2014/08/21 PHP
Zend Framework教程之动作的基类Zend_Controller_Action详解
2016/03/07 PHP
PHP记录和读取JSON格式日志文件
2016/07/07 PHP
Laravel框架路由设置与使用示例
2018/06/12 PHP
JavaScript的面向对象(二)
2006/11/09 Javascript
半角全角相互转换的js函数
2009/10/16 Javascript
测试JavaScript字符串处理性能的代码
2009/12/07 Javascript
JS验证控制输入中英文字节长度(input、textarea等)具体实例
2013/06/21 Javascript
jquery form表单序列化为对象的示例代码
2014/03/05 Javascript
jQuery选择id属性带有点符号元素的方法
2015/03/17 Javascript
解决JS请求服务器gbk文件乱码的问题
2015/10/16 Javascript
JS实现的幻灯片切换显示效果
2016/09/07 Javascript
webpack vue 项目打包生成的文件,资源文件报404问题的修复方法(总结篇)
2018/01/09 Javascript
vue-router之nuxt动态路由设置的两种方法小结
2018/09/26 Javascript
详解Vue的watch中的immediate与watch是什么意思
2019/12/30 Javascript
openLayer4实现动态改变标注图标
2020/08/17 Javascript
js实现鼠标点击飘爱心效果
2020/08/19 Javascript
vue 监听 Treeselect 选择项的改变操作
2020/08/31 Javascript
使用python编写android截屏脚本双击运行即可
2014/07/21 Python
python 循环while和for in简单实例
2016/08/16 Python
python 性能优化方法小结
2017/03/31 Python
pandas计数 value_counts()的使用
2019/06/24 Python
python3 map函数和filter函数详解
2019/08/26 Python
Python基础之字符串操作常用函数集合
2020/02/09 Python
基于Tensorflow:CPU性能分析
2020/02/10 Python
英国虚拟主机服务商:eUKhost
2016/08/16 全球购物
售后专员岗位职责
2013/12/08 职场文书
2014年流动人口工作总结
2014/11/26 职场文书
学生通报表扬范文
2015/05/04 职场文书
校运会班级霸气口号
2015/12/24 职场文书
pytorch 中autograd.grad()函数的用法说明
2021/05/12 Python
了解Kubernetes中的Service和Endpoint
2022/04/01 Servers
《现实主义勇者的王国再建记》第三弹OST全曲试听片段公开
2022/04/04 日漫
使用Bandicam录制鼠标指针并附带点击声音,还可以添加点击动画效果
2022/04/11 数码科技