<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script>

        function doTTS() {

            var ttsDiv = document.getElementById('bdtts_div_id');

            var ttsAudio = document.getElementById('tts_autio_id');

            var ttsText = document.getElementById('ttsText').value;

            // 文字转语音

            ttsDiv.removeChild(ttsAudio);

            var au1 = '<audio id="tts_autio_id" autoplay="autoplay">';

            var sss = '<source id="tts_source_id" src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&per=3&spd=5&text=' + ttsText + '" 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>

</head>

<body>

    <div>

        <input type="text" id="ttsText" />

        <input type="button" id="tts_btn" onclick="doTTS()" value="播放" />

    </div>

    <div id="bdtts_div_id">

        <audio id="tts_autio_id" autoplay="autoplay">

          <source id="tts_source_id" src="http://tts.baidu.com/text2audio?lan=zh&amp;ie=UTF-8&amp;spd=5&amp;per=1&amp;text=请输入文字" type="audio/mpeg">

          <embed id="tts_embed_id" height="0" width="0" src="">

        </audio>

    </div>

</body>

</html>

【转】调用百度API，HTML在线文字转语音播报的更多相关文章

  1. 调用百度API进行文本纠错

    毕设做的是文本纠错方面,然后今天进组见研究生导师 .老师对我做的东西蛮感兴趣.然后介绍自己现在做的一些项目,其中有个模块需要有用到文本纠错功能. 要求1:有多人同时在线编辑文档,然后文档功能有类似Wo ...

  2. 调用百度API返回经纬度

    后台调用百度API接口生成: import java.io.BufferedReader; import java.io.IOException;import java.io.InputStreamR ...

  3. java文字转语音播报功能的实现方法

    java文字转语音播报功能的实现方法 一.pom.xml引入jar包依赖 <!-- https://mvnrepository.com/artifact/com.jacob/jacob 文字转语 ...

  4. 前端调用百度API

    <!DOCTYPE html> <html> <head>         <meta charset="UTF-8">       ...

  5. Vue 通过调用百度API获取地理位置-经度纬度省份城市

    一.首先在百度api注册获得ak密钥 二.新建js文件,我命名为loadBMap.js,里面创建script,代码如下: /** * 加载地图 * @param {Function} callback ...

  6. Android实例-调用GOOGLE的TTS实现文字转语音(XE7+小米2)(无图)

    注意:在手机上必须选安装文字转语音引擎“google Text To Speech”地址:http://www.shouji56.com/soft/GoogleWenZiZhuanYuYinYinQi ...

  7. 调用GOOGLE的TTS实现文字转语音(XE7+小米2)(XE10.1+小米5)

    相关资料: 注意:在手机上必须选安装文字转语音引擎“google Text To Speech”地址:http://www.shouji56.com/soft/GoogleWenZiZhuanYuYi ...

  8. Android实例-调用GOOGLE的TTS实现文字转语音(XE7+小米2)(XE10.1+小米5)

    相关资料: 注意:在手机上必须选安装文字转语音引擎“google Text To Speech”地址:http://www.shouji56.com/soft/GoogleWenZiZhuanYuYi ...

  9. iOS语音识别，语音播报，文字变语音播报，语音变文字

    首先使用的是科大讯飞的sdk 1.语音识别部分 AppDelegate.m #import "AppDelegate.h" #import <iflyMSC/iflyMSC. ...

随机推荐

  1. C#环境配置

    由于C#是,Net框架的一部分,且用于编写.Net应用程序,所以我们需先了解下C#与.Net框架之间的关系. .Net框架(.Net Framework) .Net框架是一个创新的平台,能帮你编写出下 ...

  2. 11、VUE混合

    1.混合的概念(mixture) 混合是以一种灵活的方式,为组件提供代码复用功能.(类似于封装) 混合对象可以包含任意的组件选项.当组件使用了混合对象时,混合对象的所有选项将被“混入”组件自己的选项中 ...

  3. css权重等级

    1.问题起因(在一次偶然编写css发现的,.div2 p>.div1 p>.p1,然后做了测试并找查相关资料) 2.解决方案 首先看哪一级的权重高 1.!important,加在样式属性值 ...

  4. javascript之DOM选择符

    javascript库中最常用的一项功能,就是根据CSS选择符选择与某个模式匹配的DOM元素.实际上jQuery的核心就是通过css选择符查询DOM文档取得元素的引用,从而抛开了getElementB ...

  5. flask实战-个人博客-编写博客前台

    编写博客前台 博客前台需要开放给所有用户,这里包括显示文章列表.博客信息.文章内容和评论等功能功能. 分页显示文章列表 为了在主页显示文章列表,我们要先在渲染主页模板的index视图的数据库中获取所有 ...

  6. 云服务器ECS（Elastic Compute Service），知识点

    资料 网址 什么是云服务器ECS https://help.aliyun.com/document_detail/25367.html?spm=a2c4g.11186623.6.544.4e1e376 ...

  7. tomcat 多实例部署

    tomcat 配置多个实例 参考文档 聊聊 Tomcat 的单机多实例 https://www.cnblogs.com/mafly/p/tomcat.html 极客学院 Tomcat 8 权威指南 h ...

  8. 每天一道Rust-LeetCode(2019-06-03)

    每天一道Rust-LeetCode(2019-06-02) 有序链表转换二叉搜索树 坚持每天一道题,刷题学习Rust. 原题 题目描述 给定一个单链表,其中的元素按升序排序,将其转换为高度平衡的二叉搜 ...

  9. 总结：几种生成html格式测试报告的方法

    写自动化测试时,一个很重要的任务就是生成漂亮的测试报告. 1.用junit或testNg时,可以用ant辅助生成html格式: <target name="report" d ...

  10. Q1094

    一,看题 1,字符串确实是我的弱项. 2, 二,看题解 #include<iostream> #include<string> using namespace std; int ...