打BOSS倒计时小程序之在页面上将文字合成语音并播放出来

页面的基本结构和效果可以参考前面的,链接:http://1017401036.iteye.com/blog/2395817

基本业务:倒计时功能启动后,若剩下的时间小于或等于系统设定的提醒时长,系统会自动将该项倒计时时间加粗、标红显示,且往前排,同时进行语音提示。这里主要贴语音提示的功能。

参考链接:https://my.oschina.net/chwencong/blog/778483

代码如下:

//播报语音用的参数
var lan="zh";//lan=zh:语言是中文,如果改为lan=en,则语言是英文。
var ie = "UTF-8";//ie=UTF-8:文字格式。
var spd = 5;//spd=2:语速,可以是1-9的数字,数字越大,语速越快。
//text=**:这个就是你要转换的文字。
var url="http://tts.baidu.com/text2audio?lan="+lan+"&ie="+ie+"&spd="+spd+"&text=";

/**
 * 该方法用来播放语音(因为source的src替换之后不生效,所以只能先删除再添加)
 * @param curID:当前调用哪个播放器播放,若是没有则生成一个
 * @param text:播报内容
 * **/
function playRemindInfo(curID,text){
	//若是没有播报内容,那么不播报
	if(text==null || text==undefined || text.toString().length<=0){return false;}
	
	//2、判断播放插件是否存在,若存在删除
	var src = url+encodeURI(text);
	 var autio = document.getElementById("autio_id_"+curID);
	 if(autio){//说明存在,那么需要先删除
	 	$("#autio_id_"+curID).remove();
	 }
	 //3、添加新的播放器标签
	 var html = "<audio id=\"autio_id_"+curID+"\">"
				+"<source id=\"source_id_"+curID+"\" src=\""+src+"\" type=\"audio/mpeg\">"
				+"<embed id=\"embed_id_"+curID+"\" height=\"0\" width=\"0\" src=\"\">"
				+"</audio>";
	$("#play_div").append(html);
		
	//4、进行播放
	autio = document.getElementById("autio_id_"+curID);
	autio.play();//进行播放
}

 说明:curID是每行的唯一ID,用来区分每行数据,也用来生成多个播放器,因为考虑到可能同时播放多个语音。

最后祝大家好运!

猜你喜欢

转载自1017401036.iteye.com/blog/2395830