将文字换成声音 demo

最新推荐文章于 2024-05-23 17:14:28 发布

光影3415

最新推荐文章于 2024-05-23 17:14:28 发布

阅读量198

点赞数

分类专栏： html 文章标签： html

本文链接：https://blog.csdn.net/qq_30346433/article/details/103831153

版权

html 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<html>
<head>
<title>文字转声音</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
<meta name="description"
content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.
">

</head>
<body>
   <div>
   <div> 文字转声音</div>
   <div>
       <input type="text" id= "words" />
       <input type="button" οnclick="speakText()" value="开始读"/>
       <input type="button" οnclick="stopSpeak()" value="停止读"/>
   </div>
   </div>

   <script type="text/javascript">
       var speaker = new window.SpeechSynthesisUtterance();
       var speakTimer,
           stopTimer;

       // 开始朗读
       function speakText() {
           var text = document.getElementById("words").value;
           if(text == ""){
               text = "你还没有输入要读的内容"
           }
           clearTimeout(speakTimer);
           window.speechSynthesis.cancel();
           speakTimer = setTimeout(function () {
               speaker.text = text;
               window.speechSynthesis.speak(speaker);
           }, 200);
       }

       // 停止朗读
       function stopSpeak() {
           clearTimeout(stopTimer);
           clearTimeout(speakTimer);
           stopTimer = setTimeout(function () {
               window.speechSynthesis.cancel();
           }, 20);
       }
   </script>
</body>
</html>

创建一个 html 格式的文件，然后用 notepad 打开，将上面贴上就ok了。

光影3415

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
将文字换成声音 demo

<html><head><title>文字转声音</title><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width...
复制链接

扫一扫