我正在尝试找出一种可靠的方式,将字符串数组传递给Speech Synthesis API,并在说出每个数组项之间有间隔。例如。说出项目1,暂停x秒,说出项目2,依此类推。
我尝试使用API的onend
方法/事件,但是在完全停止工作之前,它只工作了几次,从那一点开始连续读回其余数组项。
有什么建议吗?
var dropdown = $('#item-select'),
interval = $('#item-interval').val() * 1000,
itemBtn = $('#item-btn'),
stopBtn = $('#item-stop'),
items = {
'first': ['hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine', 'hello, sunshine'],
'second': ['hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world', 'hello, world']
};
if ('speechSynthesis' in window) {
function speak(text) {
var msg = new SpeechSynthesisUtterance();
msg.text = text;
speechSynthesis.speak(msg);
msg.addEventListener('end', function(e) {
speechSynthesis.pause();
window.setTimeout(function() {
speechSynthesis.resume();
}, interval);
});
}
itemBtn.on('click', function(evt) {
currItem = items[dropdown.val()];
for (var phrase in currItem) {
speak(currItem[phrase]);
}
});
stopBtn.on('click', function(evt) {
speechSynthesis.cancel();
});
} else {
console.log('Voice synthesis isn\'t supported in your browser.');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id='item-select'>
<option selected value='first'>First Item</option>
<option value='second'>Second Item</option>
</select>
<label for='item-interval'>Interval (seconds)</label>
<input id='item-interval' max='10' name='item-interval' type='range' value='2'>
<button id='item-btn'>Speak!</button>
<button id='item-stop'>CEASE FIRE</button>
最佳答案
如何通过一系列项目进行延时延迟的递归旅行:
function speak(list) {
if (list.length) {
var msg = new SpeechSynthesisUtterance();
msg.text = list[0];
speechSynthesis.speak(msg);
msg.addEventListener('end', function(e) {
window.setTimeout(() => {
speak(list.slice(1));
}, interval);
});
}
}
itemBtn.on('click', function(evt) {
const list = items[dropdown.val()];
speak(list);
});
它对我有用,但是后来我遇到了一些奇怪的问题。
有时,SpeechSynthesis只是停止触发“结束”事件:
这个小提琴会添加一些日志以显示发声的开始/结束时间。观察“结束”事件是否无故终止。
https://jsfiddle.net/cak4bju9/2/
这个关于越野车行为的文章非常有用:
SpeechSynthesis API onend callback not working