首页 > 其他分享> > js文本语音播报

js文本语音播报

2021-01-05 15:34:05 作者：互联网

js文本语音播报

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>
        <p id="Text">1</p>
        <input type="button" onclick="doTTS()" value="播放">
    </div>
    <div id="box">

    </div>
</body>
<script>
    function doTTS() {
        var box = document.getElementById('box');
        var Audio = document.getElementById('autio_id');
        var ttsText = document.getElementById('Text').innerHTML
        // 播报出座位号
        var msg="10"
        var str = `<audio id="autio_id" autoplay="autoplay">
                      <source src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=5&text=你的座位号为${msg}号" type="audio/mpeg">
		         </audio>
             `
        box.innerHTML = str;
        var playPromise = Audio.play();
        if (playPromise !== undefined) {
            playPromise.then(_ => {
                Audio.pause();
            })
                .catch(error => {

                });
        }
    }
</script>

</html>

标签：播报,box,document,playPromise,Audio,js,getElementById,var,文本
来源： https://www.cnblogs.com/cupid10/p/14236092.html