导火线 : 负责了项目中的话务间模块,处理音频出了一点问题

之前的处理 :

　　//循环播放声音

var dialAudioDocument = document.createElement('audio');  //这是拨号的声音(这里只写了一个音频)

var dialSource = document.createElement('source');

dialSource.type = "audio/mpeg";

dialSource.type = "audio/mpeg";

dialSource.autoplay = "autoplay";

dialSource.controls = "controls";

    　　　　

url : 表示音频路径,flag : 一个标识,来电还是拨出,audio : 表示上面的dialAudioDocument, source : 上面的dialSource

function playAudio(url, flag, audio, source) {

  console.log(url);　　　　注 : 这个的音频要借助source才能播放,并且没有方法让他停止(原因不详)

  console.log(flag);

  console.log(audio);

  console.log(source);

  source.src = url;

  audio.appendChild(source);

  audio.play();

  if (flag == "dial") {

    dialAlert = setTimeout("playAudio('" + url + "','dial', '"+audio+"', '"+source+"')", 1000*5);

  }

  if (flag == "call") {

    callAlert = setTimeout("playAudio('" + url + "','call', '"+audio+"', '"+source+"')", 1000*29);

  }

}
// 缺点:由于没有方法让音频停止,这时候只能选取时间短的音频进行循环播放,停止则通过clearInter..的方式停止,而后面换了音频,就不行了.....

当时的小demo : (测试此音频方法是否管用)

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>文档标题</title>

</head>

<body>

  <script>

    var t;

    function play2(url){

        var audio = document.createElement('audio');

        var source = document.createElement('source');

        source.type = "audio/mpeg";

        source.type = "audio/mpeg";

        source.src = url;

        source.autoplay = "autoplay";

        source.controls = "controls";

        audio.appendChild(source);

        audio.play();

        t = setTimeout("play2('"+url+"')",2000);

    }

    function aa(){

        console.log(t);

        clearTimeout(t);

        console.log(t);

        clearTimeout(t);

    }

  </script>

  <input type="button" value="播放" onclick="play2('http://down.chinatcc.com/TW_Call_Disconnect.ogg')" />

  <input type="button" value="停止" onclick="aa();" />

</body>

</html>

　　

　　

目前的方案:

　　



<!-- 下面是存放录音 -->
<audio id="dialAudio" src="/static/audio/dialAudio.mp3"></audio>
<audio id="callAudio" src="/static/audio/callAudio.mp3"></audio>
<audio id="hangAudio" src="/static/audio/hangAudio.mp3"></audio>




$(function () {
	//初始化录音标签
  dialAudioDocument = document.getElementById('dialAudio');  //这里只能有document得到,原因不详,猜想可能是加载顺序问题
  callAudioDocument = document.getElementById('callAudio');
  hangAudioDocument = document.getElementById('hangAudio');


//循环播放声音

function playAudio(document, flag) {

  console.log(document);

  document.currentTime = 0;

  document.play();

  if (flag == "dial") {

    dialAlert = setTimeout("playAudio('" + document + "','dial')", 1000*5);

  }

  if (flag == "call") {

    callAlert = setTimeout("playAudio('" + document + "','call')", 1000*29);

  }

}



//停止掉声音
function pauseAudio(document, flag){
	if (flag == "dial") {
		document.pause();
	}
	if (flag == "call") {
		document.pause();
	}
}


优点:解决了上述的缺点




　　花时间记录,远大于死敲


　　
												


											
html页面的音频问题的更多相关文章
	

    
								
  1. 浏览器音频兼容和ffmpeg的音频转码使用
		
    浏览器对各音/视频格式的支持问题 浏览器测试效果图 ffmpeg在音频格式转换,和从视频中提取音频的简单实用 1.百度搜索浏览器对于音频文件的兼容,排在前面的文章大部分是复制粘贴很久以前的文章,容易误 ...
    
		
    2. 
						
  2. Android使用WebView加载H5页面播放视频音频，退出后还在播放问题解决
		
    Android中经常会使用到WebView来加载H5的页面,如果H5页面中有音频或者视频的播放时,还没播放完就退出界面,这个时候会发现音频或者视频还在后台播放,这就有点一脸懵逼了,下面是解决方案: 方 ...
    
		
    3. 
						
  3. Head First Html and CSS学习笔记之HTML
		
    初学前端开发,记录下自己的学习笔记. 第一章 认识HTML 1:关于HTML HTML是超文本标记语言(HyperText Markup Language)的缩写,用来建立网页的结构. 它只会根据标记 ...
    
		
    4. 
						
  4. unity3d教程游戏包含的一切文件导入资源
		
    http://www.58player.com/blog-2327-954.html 导入资源 将文件增加至工程文件夹的资源 (Assets) 文件夹后,Unity 将自动检测文件.将任何资源 (As ...
    
		
    5. 
						
  5. Unity3d用户手册用户指南 电影纹理(Movie Texture)
		
    http://www.58player.com/blog-2327-952.html 电影纹理(Movie Texture) 注意:这只是专业/高级功能.   桌面 电影纹理是从视频文件创建的动画纹理 ...
    
		
    6. 
						
  6. HTML/CSS题库
		
    一.    填空题 使用文本编辑器编辑完HTML后,扩展名可以是__html___或___htm__. 表格的标签是____table______,单元格的标签是____td______. 在编辑ta ...
    
		
    7. 
						
  7. [Java Web] 1、Web开发初识——一大堆历史和技术名词
		
    LZ前言 LZ最近发现网络真是个神奇的东西,以前做的好玩的只能自娱自乐(或者说顾影自怜),现在只要发一个帖子,写一个博客,很快能引来一大群小伙伴的围观(有时候还能遇见几个大牛给个战略性的指导)...L ...
    
		
    8. 
						
  8. JavaEE填空与判断
		
    Java EE软件工程师认证考试 试题库- 填空题和选择题   一.     填空题 1. HTML网页文件的标记是__html__,网页文件的主体标记是_body__,标记页面标题的标记是__tit ...
    
		
    9. 
						
  9. 常用jQuery代码02
		
    一.each函数拿到每个元素的宽度 setTimeout(function () { $(".sticker_list img").each(function () { var W ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. IntelliJ IDEA创建java项目
			
    IntelliJ IDEA创建java项目 进入到IntelliJ IDEA启动界面,点击Create New Project 2.这样就进入到了创建项目页面,这里可以创建好多项目,这里我们以java ...
    
			
    2. 
						
  2. 单点登录，session，jsonp（待更新）
			
    单点登录理解: 单点登录系统设计: ajax跨域:
    
			
    3. 
						
  3. Netty学习笔记（一）：接收nodejs模拟表单上传的文件
			
    好久不写博客了,也好久不写代码了,这两天临时遇上一个事情,觉得不难,加上觉得手有些生,就动手做了一下,结果遇上了不少坑,有新坑,有老坑,痛苦无比,现在总算差不多了,赶紧记录下来,希望以后不再重复这种痛 ...
    
			
    4. 
						
  4. Oracle数据库（三）表操作，连接查询，分页
			
    复制表 --复制表 create table new_table as select * from Product --复制表结构不要数据 在where后面跟一个不成立的条件,就会仅复制表的结构而不复 ...
    
			
    5. 
						
  5. Xcode极速代码，征服Xcode
			
    当谈论到iOS开发工具时,有一个肯定是所有iOS开发者都熟悉的,那就是Xcode.Xcode是使所有令人赞叹的iOS app成为可能的驱动力. Xcode能帮助我们完成非常多的事情,但是这也有点让人头 ...
    
			
    6. 
						
  6. display:none和visiblity:hidden区别
			
    相同: 1.两者都能隐藏元素. 不同: 1.display:none 不占页面空间,visiblity:hidden 占据原先页面空间. 这里必须说明的是,元素不占页面空间后,取该元素或其内部元素的宽 ...
    
			
    7. 
						
  7. C：函数：功能：实现字符数组中所有字母的倒序存放并输出
			
    前两天小测碰到一道题,建立一个函数,功能:实现字符数组中所有字母的倒序存放并输出,一开始觉得简单跟数字数组差不多,运行一下发现很多格式错误,这些是不必要的错误,现在就来说下,先说一下代码思路:定义一个 ...
    
			
    8. 
						
  8. Python 多线程进程高级指南(二)
			
    本文是如何<优雅地实现Python通用多线程/进程并行模块>的后续.因为我发现,自认为懂了一点多线程开发的皮毛,写了那么个multi_helper的玩意儿,后来才发现我靠原来就是一坨屎.自 ...
    
			
    9. 
						
  9. ArcGIS 网络分析[2.2] 服务区分析
			
    什么是服务区? 我们先提一个很常见的社会现象:一个医院,如果要发起抢救,那么10分钟内能去多远? 时间就是生命,当结合道路网的阻力进行最短路径分析时,得到的可达的覆盖区域,这个区域就是服务区. 服务区 ...
    
			
    10. 
						
  10. js回到顶部------转载
			
    [1]锚点 使用锚点链接是一种简单的返回顶部的功能实现.该实现主要在页面顶部放置一个指定名称的锚点链接,然后在页面下方放置一个返回到该锚点的链接,用户点击该链接即可返回到该锚点所在的顶部位置 [注意] ...
    
			
    11.