嗷嗷方便的文字转语音,不过用的时候记得到百度语音上申请key,免费的.之前在网络上看到有人写了一部分,自己丰富下,以后用也方便

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>百度语音测试</title>
</head>
<body>
<div>
<input type="text" id="ttsText">
<input type="button" id="tts_btn" onclick="doTTS()" value="获取新的语音">
<input type="button" id="tts_btns" onclick="zanting()" value="暂停">
<input type="button" id="tts_btns" onclick="jixu()" value="继续/播放">
<input type="button" id="tts_btns" onclick="shichang()" value="时长">
</div>
<div id="bdtts_div_id">
<audio id="tts_autio_id" >
<source id="tts_source_id" src="https://tsn.baidu.com/text2audio?tex=我喜欢你&lan=zh&per=4&cuid=1&ctp=1&tok=24.71726d18e11bf62415c11e3c2aa88121.2592000.1544946462.282335-14837008" type="audio/mpeg">
<embed id="tts_embed_id" height="0" width="0" src="">
</audio>
</div>
</body>
</html>
<script> function zanting() {
var ttsAudio = document.getElementById('tts_autio_id');
ttsAudio.pause();
}
function jixu() {
var ttsAudio = document.getElementById('tts_autio_id');
ttsAudio.play();
} function shichang() {
var ttsAudio = document.getElementById('tts_autio_id');
alert(ttsAudio.duration);
} function doTTS(){
var ttsDiv = document.getElementById('bdtts_div_id');
var ttsAudio = document.getElementById('tts_autio_id');
var ttsText = document.getElementById('ttsText').value; // 这样为什么替换不了播放内容
/*var ssrcc = 'http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=10&text='+ttsText;
document.getElementById('tts_source_id').src=ssrcc;*/ // 这样就可实现播放内容的替换了
ttsDiv.removeChild(ttsAudio);
var au1 = '<audio id="tts_autio_id" autoplay="autoplay">';
var sss = '<source id="tts_source_id" src="https://tsn.baidu.com/text2audio?tex='+ttsText+'&lan=zh&per=4&cuid=1&ctp=1&tok=24.71726d18e11bf62415c11e3c2aa88121.2592000.1544946462.282335-14837008" type="audio/mpeg">';
var eee = '<embed id="tts_embed_id" height="0" width="0" src="">';
var au2 = '</audio>';
ttsDiv.innerHTML = au1 + sss + eee + au2; ttsAudio = document.getElementById('tts_autio_id'); ttsAudio.play();
} </script>

[js常用]百度将文字转化为语音实例的更多相关文章

  1. [js常用]文字转化成语音

    使用百度语音接口,实现文字转化成语音播放 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &qu ...

  2. js将文字转化为语音并播放

    js将页面中的某些文字信息转化为语音并自动播放 <!DOCTYPE html><html lang="en"><head> <meta c ...

  3. win 文字转化为语音

    mshta vbscript:createobject("sapi.spvoice").speak("hello")(window.close)

  4. Js常用技巧

    摘录:http://crasywind.blog.163.com/blog/static/7820316920091011643149/ js 常用技巧 1. on contextmenu=" ...

  5. JS常用的标准函数

    原文:JS常用的标准函数 1.Array类型函数 array.concat(item...) 函数功能:关联数组,实现数组相加功能,但并不影响原先数组,concat返回新数组. array.join( ...

  6. python将文本转化成语音并播放

    一.问题 在学习的过程中,我们会涉及到将文本信息,转化成语音的过程,比如:我爬取了一个小说的网站,我要将里面的内容进行语音处理.目前能够进行语音的方法还是很多,比如win32com,百度ai. 二.解 ...

  7. 02: vue.js常用指令

    目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 目录: 1.1 vuejs简介 1.2 选择器:根据id.class等查找 1.3 静态绑定数据 data 1.4 插值 { ...

  8. JS常用自定义函数总结

    JS常用自定义函数总结   1.原生JavaScript实现字符串长度截取 2.原生JavaScript获取域名主机 3.原生JavaScript清除空格 4.原生JavaScript替换全部 5.原 ...

  9. php+js实现百度地图多点标注的方法

    本文实例讲述了php+js实现百度地图多点标注的方法.分享给大家供大家参考,具体如下: 1.php创建json数据 ? 1 2 $products = $this->product_db-> ...

随机推荐

  1. nginx并发连接控制模块ngx_http_limit_conn_module

    模块: ngx_http_limit_conn_module 作用: 根据定义的key限制并发连接数 配置示例: http { limit_conn_zone $binary_remote_addr ...

  2. java验证身份证合理性

    package com.tiantian.util; import java.util.Calendar;import java.util.HashMap;import java.util.Map;i ...

  3. Swift 里字符串(十)修改字符串

    以append操作为例 public mutating func append(_ other: String) { if self.isEmpty && !_guts.hasNati ...

  4. Swift 里字符串(二)创建

     最终都要走到__StringStorage 的 create(realCodeUnitCapacity,countAndFlags) 方法里去. 默认实现是 UTF8 internal stati ...

  5. django -orm操作总结

    前言 Django框架功能齐全自带数据库操作功能,本文主要介绍Django的ORM框架 到目前为止,当我们的程序涉及到数据库相关操作时,我们一般都会这么搞: 创建数据库,设计表结构和字段 使用 MyS ...

  6. 小div在大div里面水平垂直都居中的实现方法

    关于如何设置小盒子在大盒子里面水平垂直方向同时居中的实现方法有很多种,下面仅列举了常用的几种. 首先看一下要实现的效果图及对应的html代码: <div class="parent&q ...

  7. 用postman做接口测试实例

    使用postman做接口测试,可以选择请求方式,可以直接输入参数和header,可以编写测试结果的代码,判断是否通过测试 下图为填写接口测试地址.填写接口的参数,点击send发送请求 其中,Param ...

  8. POJ 1036

    #include<iostream> #include<algorithm> #define MAXN 205 using namespace std; struct node ...

  9. MediaWIKI部署流程

    1.下载mediawiki,地址:https://www.mediawiki.org/wiki/MediaWiki 2.下载xxamp集成软件,地址:https://www.apachefriends ...

  10. 在Linux系统安装Nodejs最简单步骤

    一.去官网下载和自己系统匹配的文件 英文网址:https://nodejs.org/en/download/ 中文网址:http://nodejs.cn/download/ 通过  uname -a ...