From ac71e34b815037f171cc73cc66553a645d1067a5 Mon Sep 17 00:00:00 2001 From: hdw <496960745@qq.com> Date: 星期六, 27 十月 2018 16:45:05 +0800 Subject: [PATCH] 语音播报 --- gx_tieta/WebRoot/test-voice.html | 76 ++++++++++++++++++++++++++++++++++++++ 1 files changed, 76 insertions(+), 0 deletions(-) diff --git a/gx_tieta/WebRoot/test-voice.html b/gx_tieta/WebRoot/test-voice.html new file mode 100644 index 0000000..de36e87 --- /dev/null +++ b/gx_tieta/WebRoot/test-voice.html @@ -0,0 +1,76 @@ +<!DOCTYPE html> +<html> + + <head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>H5璇煶鎾姤鍔熻兘</title> + <style> + article {margin: 0 auto;max-width: 800px;text-align: center;} + textarea {max-width: 600px;width:100%;text-align: left;} + button{border-radius: 3px;border: 1px solid #dddddd;height: 30px;width: 80px;cursor: pointer;} + </style> + <link rel="stylesheet" href="src/css/layui.css"> + </head> + + <body> + 鎴戞槸璇煶鎾姤 + </body> + <script type="text/javascript" src="src/layui.all.js"></script> + <script> + + // 璁剧疆璇煶鎾姤瀵硅薄 + var Voice = function() { + this.speak = window.speechSynthesis; + this.voice = ''; + this.zh_CN = false; + this._setLang(); // 鑾峰彇骞舵娴嬫槸鍚︽湁涓枃鐨勭幆澧� + }; + + // 鎾姤璇煶 + Voice.prototype.play = function(txt) { + if(!this.zh_CN) { + if(layer) { + layer.msg(''); + }else { + alert('浣犵殑鐢佃剳涓嶆敮鎸佷腑鏂囨挱鎶ワ紒'); + } + return; + } + this.cancel(); + var to_speak = new SpeechSynthesisUtterance(txt); + to_speak.voice = this.voice; // 璁惧畾涓枃鎾姤 + + this.speak.speak(to_speak); + + }; + + // 閫�鍑哄綋鍓嶆挱鎶� + Voice.prototype.cancel = function() { + this.speak.cancel(); + }; + + // 妫�鏌ュ綋鍓嶈瑷�鐜 + Voice.prototype._setLang = function() { + var _this = this; + setTimeout(function(){ + var voices = _this.speak.getVoices(); + for(var i=0; i<voices.length; i++) { + var _voices = voices[0]; + if(_voices.lang === 'zh-CN') { + _this.zh_CN = true; + _this.voice = _voices; + } + } + }, 0); + }; + + + var voice = new Voice(); + + setTimeout(function() { + voice.play('鎴戞槸璇煶鎾姤'); + }, 3000); + </script> + +</html> \ No newline at end of file -- Gitblit v1.9.1