语音循环播放测试demo

<!DOCTYPE HTML>
<html>
<head>
  <title>测试</title>
  <script src="https://cdn.bootcss.com/jquery/1.12.3/jquery.min.js"></script>
  
</head>
<body>
<input id="word" type="text" value="呼叫">
<button onclick="addList()">add</button>

<audio id="player">
</audio>

</body>
</html>
<script>
var list = [];
var tempPlayIdx = 0;
var isPlaying = false;
var playUrl = "http://218.75.108.158/tts/webtts.aspx"

$(document).on('click','.voice', function() {
    $(this).addClass('voice1');
    $("#player").bind('ended',function () {
        isPlaying = false;
    });
});


function addList() {
    var text = $("#word").val();
    list.push({"text":text});
}

function start() {
    window.setInterval(playNext,1000);
}


function playNext() {
    if(tempPlayIdx < list.length && !isPlaying){
      isPlaying = true;
      var tmpPlayText = list[tempPlayIdx].text;
      tempPlayIdx++;
      playSound(tmpPlayText);
    }
}


function playSound(text) {
  $("#player").attr("src", playUrl +"?text=" + text);
  $("#player").attr("autoplay", "autoplay");
  //$("#player").attr("controls", "controls");
  var aud = document.getElementById("player");
  aud.onended = function() {
      isPlaying = false;
  };
}
start();
</script>

 

 

在项目中用websocket来发送数据 在onmessage里获取数据

//全局变量
var arrayObj = new Array();
ws.onmessage = function(evnt) {
        var a=    JSON.parse(evnt.data);
        //语音播报
        if(av !=null){
        person=new Object();
        person.avName=av;
        person.avStat=0;
        arrayObj.push(person);
        console.log(arrayObj);
            
    }
}  
function start() {
    window.setInterval(videLoad,1000);
}
function videLoad(){
        
     var playUrl = "http://218.75.108.158/tts/webtts.aspx?text=";
     var ordernum=0;
     if(arrayObj.length!=0){
     for (var i = 0; i < arrayObj.length; i++) {
         ordernum =i;
         if(arrayObj[i].avStat==1){
             break;
         }
         if(arrayObj[i].avStat==2){
             continue;
         }
         if(arrayObj[i].avStat==0){
             var src= playUrl+arrayObj[i].avName;
               $("#player").attr("src",src);
             //  $("#player").attr("autoplay", "autoplay");
             // $("#player").attr("controls", "controls");
              var aud = document.getElementById("player");
               arrayObj[ordernum].avStat=1;
         }
     }
}    
     //播放中
     $("#player").bind('ended',function () {
        arrayObj[ordernum].avStat=2;
    });    

}
start();

 

posted @ 2018-12-06 16:03  小凢  阅读(339)  评论(0编辑  收藏  举报