window.speechSynthesis.speak文字朗读示例
更新:2023-06-01 10:04:04
人气:1137
来源:本站原创
A+
window.speechSynthesis.speak文字朗读示例,可以应用到中文或英文都可以,示例测试使用的是Chrome浏览器,请注意一下浏览器的版本
中文文字和英文朗读使用示例:
<script>
var speaker = new window.SpeechSynthesisUtterance();
// 开始朗读
function speakText() {
var context = $('#num_result').val();
window.speechSynthesis.cancel();
if ($('#sudu').val()=='' || isNaN($('#sudu').val())===true ){
alert('朗读速度,填写错误!')
return false
}
/*
SpeechSynthesisUtterance.lang:设置话语的语言。 例如:“zh-cn”表示中文
SpeechSynthesisUtterance.pitch:设置说话的音调(音高)。范围从0(最小)到2(最大)。默认值为1
SpeechSynthesisUtterance.rate:设置说话的速度。默认值是1,范围是0.1到10,表示语速的倍数,例如2表示正常语速的两倍
SpeechSynthesisUtterance.text:设置在说话时将合成的文本内容。
SpeechSynthesisUtterance.volume:设置将在其中发言的音量。区间范围是0到1,默认是1
*/
speaker.rate = $("#sudu").val() //设置说话语速 语音朗读速度
speaker.pitch = 1 //设置说话音量
speaker.text = context;
window.speechSynthesis.speak(speaker);
}
// 取消朗读
function stopSpeak() {
window.speechSynthesis.cancel();
}
// 暂停朗读
function pausedText() {
window.speechSynthesis.pause();
}
// 暂停后继续朗读
function resumeText() {
window.speechSynthesis.resume();
}
HTML中按钮事件:
<div class="line1">
<strong>朗读速度:</strong><input name="sudu" id="sudu" class="num_input" type="text" value="1" title="速度从0.1-2" onkeyup="this.value=this.value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.');"/>
</div>
<div class="line1">
<strong>朗读内容:</strong><textarea name="num_result" id="num_result" style="width:600px; height:120px;" class="input_border"></textarea>
</div>
<input type="button" id="btn1" class="v_input" onclick="speakText()" value="播放">
<input type="button" id="btn2" class="v_input" onclick="pausedText()" value="暂停">
<input type="button" id="btn3" class="v_input" onclick="resumeText()" value="继续">
<input type="button" id="btn4" class="v_input" onclick="stopSpeak()" value="取消">
推荐的文章
随手记
- ● blob:http地址的原理及生成方法
- ● 华视CVR100系统身份证读卡器web驱动安装不识别解决办法
- ● web应用采用webcam实现拍照上传的PHP示例及参数说明
- ● PHP实现直播推流功能
- ● win10开机后屏幕黑屏只有鼠标但能启动任务管理器
- ● base64.js文件下载及使用方法说明
- ● windows利用bat微信双开、多开
- ● 百度API提交推送报{"error":401,"message":"tokenisnotvalid"}什么原因
- ● 如果在调用创建群接口时没有保存OpenConversationId,可以通过调用本接口通过chatId获取OpenConversationId
- ● Windows中使用BAT文件设置指定IP地址或自动获取IP
PHP经验分享
- ● MySQLSUM在没有符合查询条件时返回结果为空的处理办法
- ● 如何开启PHP8的JIT提升运行速度
- ● 钉钉API接口-用PHP+Curl实现获取用户信息
- ● 钉钉API接口-用PHP+Curl实现获取应用Access_Token
- ● 在PHP中使用CURL,“撩”服务器只需几行——phpcurl详细解析和常见大坑
- ● MySQLInnodb并发涉及参数说明
- ● mysql参数调优之innodb_thread_concurrency、innodb_concurrency_tickets合理的使用cpu性能
- ● PHP用fsockopen检测指定IP端口是否开启可用
- ● PHP用socket检测服务器IP端口是否开放?代码示例
- ● GatewayWorker报错:Waring:Events::onMessageisnotcallable