@0Melon0
12 months ago
parent
3bbdb3301c
commit
81d7140c35
@ -1,46 +1,69 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Speech Synthesis Example</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Speech Synthesis Example</h1>
|
||||
<input type="text" id="text" value="请0的家属到手术室门口接病人">
|
||||
<br>
|
||||
<button onclick="speakText()">Speak</button>
|
||||
|
||||
<script>
|
||||
const synth = window.speechSynthesis;
|
||||
|
||||
function speakText() {
|
||||
const textInput = document.getElementById('text').value;
|
||||
const utterance = new SpeechSynthesisUtterance(textInput);
|
||||
|
||||
// 固定播放速度和语音
|
||||
utterance.rate = 1.0; // 播放速度
|
||||
const voices = synth.getVoices();
|
||||
const selectedVoice = voices.find(voice => voice.lang === 'zh-CN'); // 固定选择中文（普通话）的语音
|
||||
|
||||
if (selectedVoice) {
|
||||
utterance.voice = selectedVoice;
|
||||
}
|
||||
<head>
|
||||
<title>Speech Synthesis Example</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Speech Synthesis Example</h1>
|
||||
<input type="text" id="text" value="请0的家属到手术室门口接病人" />
|
||||
<br />
|
||||
<label for="rate">Rate:</label>
|
||||
<input type="number" id="rate" value="1" step="0.1" min="0.1" max="10" />
|
||||
<br />
|
||||
<label for="voice">Voice:</label>
|
||||
<select id="voiceSelect"></select>
|
||||
<br />
|
||||
<button onclick="speakText()">Speak</button>
|
||||
|
||||
// 添加 onend 事件处理器
|
||||
utterance.onend = function(event) {
|
||||
console.log('Speech has finished.');
|
||||
};
|
||||
<script>
|
||||
const synth = window.speechSynthesis;
|
||||
const voiceSelect = document.getElementById('voiceSelect');
|
||||
|
||||
window.speechSynthesis.speak(utterance);
|
||||
}
|
||||
function populateVoiceList() {
|
||||
const voices = synth.getVoices();
|
||||
console.log(voices);
|
||||
if (voices.length === 0) {
|
||||
synth.onvoiceschanged = populateVoiceList;
|
||||
} else {
|
||||
voiceSelect.innerHTML = ''; // 清空之前的选项
|
||||
voices.forEach((voice, index) => {
|
||||
const option = document.createElement('option');
|
||||
option.textContent = `${voice.name} (${voice.lang})`;
|
||||
console.log(`${voice.name} (${voice.lang})`);
|
||||
option.value = index;
|
||||
voiceSelect.appendChild(option);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 等待语音列表加载完成
|
||||
function checkVoices() {
|
||||
if (synth.getVoices().length !== 0) {
|
||||
clearInterval(voicesCheckInterval);
|
||||
populateVoiceList();
|
||||
if (typeof synth.onvoiceschanged !== 'undefined') {
|
||||
synth.onvoiceschanged = populateVoiceList;
|
||||
}
|
||||
}
|
||||
|
||||
const voicesCheckInterval = setInterval(checkVoices, 100);
|
||||
</script>
|
||||
</body>
|
||||
function speakText() {
|
||||
window.speechSynthesis.cancel(); // 清除之前的语音合成
|
||||
|
||||
setTimeout(() => {
|
||||
const textInput = document.getElementById('text').value;
|
||||
const rate = parseFloat(document.getElementById('rate').value);
|
||||
|
||||
|
||||
const utterance = new SpeechSynthesisUtterance([textInput, textInput, textInput].join(''));
|
||||
|
||||
const selectedVoiceIndex = voiceSelect.selectedOptions[0].value;
|
||||
const voices = synth.getVoices();
|
||||
utterance.voice = voices[selectedVoiceIndex];
|
||||
utterance.rate = rate;
|
||||
|
||||
utterance.onend = function (event) {
|
||||
console.log('Speech has finished.');
|
||||
alert('Speech has finished.');
|
||||
};
|
||||
|
||||
window.speechSynthesis.speak(utterance);
|
||||
}, 100); // 延迟 100 毫秒
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
Reference in new issue