语音合成 API 不工作答案

【问题标题】：speechSynthesis API not working语音合成 API 不工作
【发布时间】：2015-09-14 22:35:09
【问题描述】：

我正在尝试在Eric's blog 的帮助下使用speechSynthesis API。

This fiddle 工作正常，这意味着网站有no issue with the audio device permission（如果我错了，请纠正我）。我创建了own fiddle，但似乎没有用（我的意思是它不是在说 Hello world）。

这是我的代码：

function speak() {
    var msg = new SpeechSynthesisUtterance('Hello world');
    msg.rate = 0.7;
    msg.pitch = 1;
    window.speechSynthesis.speak(msg);
}

<button title="Click to listen" onclick="speak()">
         Say hello world
</button>

更新：正如enhzflep 指出的那样，代码在这里工作，但在JSFiddle's editor 中却没有

各位好心人，有什么建议吗？

【问题讨论】：

我还是什么都听不见
@rash 但我可以 :) 我已经尝试过了，似乎在 Chrome 上工作
在我的情况下重启浏览器有帮助

标签： javascript google-chrome text-to-speech speech-synthesis

【解决方案1】：

嗯。好吧，您在此页面上发布的 sn-p 对我有用，但包含相同代码的小提琴却没有。但是，如果您将第二个下拉菜单更改为"No wrap - in <head>"，那就没问题了。

这是因为 jsfiddle 将您的代码包装成一个函数，该函数在文档加载时调用，如下所示：

<script type="text/javascript">//<![CDATA[ 
window.onload=function(){
function speak() {
    var msg = new SpeechSynthesisUtterance('Hello world');
    msg.rate = 0.7;
    msg.pitch = 1;
    window.speechSynthesis.speak(msg);
}
}//]]>  
</script>

通过这样做，window.onload 处理程序之外的代码，包括您的 html 中的内联 JS 无法“看到”您的 speak 函数。

通过更改下拉菜单，jsFiddle 会为显示结果的 iframe 生成不同的 JS，如下所示：

<script type="text/javascript">//<![CDATA[ 

function speak() {
    var msg = new SpeechSynthesisUtterance('Hello world');
    msg.rate = 0.7;
    msg.pitch = 1;
    window.speechSynthesis.speak(msg);
}
//]]>  

</script>

【讨论】：