<!DOCTYPE html>
<html>
<head>
<title>HTML5 语音识别示例</title>
<meta charset="utf-8">
<script>
// 检查浏览器是否支持语音识别
if (!('webkitSpeechRecognition' in window)) {
alert("您的浏览器不支持语音识别功能！");
} else {
// 创建一个SpeechRecognition对象
var recognition = new webkitSpeechRecognition();
// 设置语音识别服务的语言，使用中文
recognition.lang = "cmn-Hans-CN";
// 设置是否连续识别
recognition.continuous = false;
// 设置识别服务的输入音频质量
recognition.interimResults = "true";
// 开始语音识别
document.getElementById('start-button').onclick = function() {
recognition.start();
}
// 处理语音识别服务的结果
recognition.onresult = function(event) {
// 获取语音识别的结果
var result = event.results[event.results.length-1][0].transcript;
// 将识别的结果显示在页面上
document.getElementById('result').innerHTML = result;
}
// 处理语音识别服务的错误
recognition.onerror = function(error) {
console.log("语音识别发生错误：", error);
}
}
</script>
</head>
<body>
<p>点击按钮开始说话，然后识别文字</p>
<button id="start-button">开始说话</button>
<p id="result"></p>
</body>
</html>这段代码首先检查浏览器是否支持webkitSpeechRecognition API。如果支持，创建一个SpeechRecognition对象，设置相关参数，并在用户点击按钮时开始语音识别。识别结果会实时显示在页面上，并处理可能出现的错误。注意，由于API特性，代码可能在非Chrome浏览器中不工作。