vue调用语音播放的方法

vue调用语音播放的方法

功能展示 输入文字 点击播放 调用语音

直接上代码

<template> <div> <!-- 语音播放功能 --> <div> <input type="text"> <input type="button" @click="myplay()" value="播放"> </div> <div> <audio autoplay="autoplay"> <source src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=9&text= " type="audio/mpeg"> <embed src=""> </audio> </div> </div> </template> <script> export default { name: 'Test', data () { return { } }, methods: { myplay(){ var ttsDiv = document.getElementById('bdtts_div_id'); var ttsAudio = document.getElementById('tts_autio_id'); var ttsText = document.getElementById('ttsText').value; ttsDiv.removeChild(ttsAudio); var au1 = '<audio autoplay="autoplay">'; var sss = '<source src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=2&text='+ttsText+'" type="audio/mpeg">'; var eee = '<embed src="">'; var au2 = '</audio>'; ttsDiv.innerHTML = au1 + sss + eee + au2; ttsAudio = document.getElementById('tts_autio_id'); ttsAudio.play(); } } } </script>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/b657230d5005ab212d190b84c345b2d4.html