webkitSpeechRecognition 不显示中间结果
webkitSpeechRecognition does not show interim results
我正在尝试实现此语音识别服务,如 HERE and display results with INTERIM (the text that alternates before the final result) similar to THIS 示例所述。您可以看到文本在到达最终结果之前交替出现。我正在关注的教程(第一个 link)也给出了一个实现此功能的示例,但它只给了我最终答案,并没有显示单词迭代动画。
<span id="final_span"></span>
<span id="interim_span" style="color: grey"></span>
<button id="button" type="button" onclick="toggleStartStop()"></button>
和Javascript:
<script type="text/javascript">
var recognizing;
var recognition = new webkitSpeechRecognition();
recognition.continuous = true;
recognition.interim = true;
reset();
recognition.onend = reset;
recognition.onresult = function (event) {
var final = "";
var interim = "";
for (var i = 0; i < event.results.length; ++i) {
if (event.results[i].final) {
final += event.results[i][0].transcript;
} else {
interim += event.results[i][0].transcript;
}
}
final_span.innerHTML = final;
interim_span.innerHTML = interim;
}
function reset() {
recognizing = false;
button.innerHTML = "Click to Speak";
}
function toggleStartStop() {
if (recognizing) {
recognition.stop();
reset();
} else {
recognition.start();
recognizing = true;
button.innerHTML = "Click to Stop";
final_span.innerHTML = "";
interim_span.innerHTML = "";
}
}
</script>
我做错了什么?我需要创建与 THIS
完全相同的东西
你需要
recognition.interimResults = true;
与您当前的来源不同
recognition.interim = true;
如果您检查所链接页面的源代码,您也可以弄清楚这一点。
我正在尝试实现此语音识别服务,如 HERE and display results with INTERIM (the text that alternates before the final result) similar to THIS 示例所述。您可以看到文本在到达最终结果之前交替出现。我正在关注的教程(第一个 link)也给出了一个实现此功能的示例,但它只给了我最终答案,并没有显示单词迭代动画。
<span id="final_span"></span>
<span id="interim_span" style="color: grey"></span>
<button id="button" type="button" onclick="toggleStartStop()"></button>
和Javascript:
<script type="text/javascript">
var recognizing;
var recognition = new webkitSpeechRecognition();
recognition.continuous = true;
recognition.interim = true;
reset();
recognition.onend = reset;
recognition.onresult = function (event) {
var final = "";
var interim = "";
for (var i = 0; i < event.results.length; ++i) {
if (event.results[i].final) {
final += event.results[i][0].transcript;
} else {
interim += event.results[i][0].transcript;
}
}
final_span.innerHTML = final;
interim_span.innerHTML = interim;
}
function reset() {
recognizing = false;
button.innerHTML = "Click to Speak";
}
function toggleStartStop() {
if (recognizing) {
recognition.stop();
reset();
} else {
recognition.start();
recognizing = true;
button.innerHTML = "Click to Stop";
final_span.innerHTML = "";
interim_span.innerHTML = "";
}
}
</script>
我做错了什么?我需要创建与 THIS
完全相同的东西你需要
recognition.interimResults = true;
与您当前的来源不同
recognition.interim = true;
如果您检查所链接页面的源代码,您也可以弄清楚这一点。