100多年前的地摊

寒冬残荷

195400 发表于 2021-10-15 15:07
代码基本是原来的就加了几句与文字转语音相关的语句

怪了，您的那个文字转语音相关的语句，我用放在html代码调试器中运行可以，放到这里不行。

195400

红枫 发表于 2021-10-15 15:22
我的意思是不用协调，不启动有音乐就行，只是音量小些，突出文字朗读罢了。仅是提议而己！

哦，那要找个舒缓的背景音乐，不过两个声音是不是同时都响就难说了。

195400

寒冬残荷 发表于 2021-10-15 15:23
怪了，您的那个文字转语音相关的语句，我用放在html代码调试器中运行可以，放到这里不行。

是不是差了点击的那一下？

寒冬残荷

195400 发表于 2021-10-15 15:46
是不是差了点击的那一下？

<div style="position:relative; width:900px;height:auto;text-align:justify;line-height:60px;font-size:30px;color:#f00;letter-spacing:2px;overflow: hidden;border:2px #FF0 solid;margin:0px auto;border-radius:16px;padding:20px; " >　　
        这是在网页上通过JS实现文本的语音朗读，即语音合成。语音合成也被称为文本转换技术（TTS），它是将计算机自己产生的、或外部输入的文字信息转变为可以听得懂的、流利的口语输出的技术。
<audio controls loop autoplay src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=6&text=这是在网页上通过JS实现文本的语音朗读，即语音合成。语音合成也被称为文本转换技术（TTS），它是将计算机自己产生的、或外部输入的文字信息转变为可以听得懂的、流利的口语输出的技术。">
</audio>
</div>

寒冬残荷

上面的代码在html调试器里正常读出，语速取6时，语音文件长度17秒，取5时20秒。在这里有声音，但不正常，语音文件长度1秒。（原来不直接放语音接口在这里就可以朗读正常。楼主的正常，应该是所有图片是使用这里上传的。2021.10.20补记。）

195400

寒冬残荷 发表于 2021-10-15 16:41
上面的代码在html调试器里正常读出，语速取6时，语音文件长度17秒，取5时20秒。在这里有声音，但不正常，语 ...

不能依赖lautoplay能自动播放，好些浏览器禁止了自动播放，也许某些网站也禁止了这功能，禁止是为了安全的考虑。
例如，我测试这段代码时就没自动开始播放（chrome）。

195400

寒冬残荷 发表于 2021-10-15 16:41
上面的代码在html调试器里正常读出，语速取6时，语音文件长度17秒，取5时20秒。在这里有声音，但不正常，语 ...

1. <div id="showTxt" style="color:red;font:bold 2em 微软雅黑;"></div>
   
2. <input type="button" value="click to play" id='mp'>
   
3. <script type="text/javascript">
   
4. var picDesc = [
   
5. "吃，乃人生存之根本。所以，食品摊永远不愁没生意！",
   
6. "热气腾腾的烧饼摊。烧瓶小哥满脸疑惑，似乎在问：要不要来一个？",
   
7. "茶饮摊。喝茶就喝茶，可千万别惹摊主，看这模样，功夫一定了得！",
   
8. "冰糖葫芦摊。如此特色的传统小吃，让人垂涎三尺。",
   
9. "白酒摊。大爷：口馋不？来一杯解解馋？",
   
10. "粽子摊。顾客吃得津津有味，老板满脸欣慰。",
    
11. "宵夜摊。寒冷的冬夜，必须来一碗热汤暖暖身子。",
    
12. "摊主这呦呵劲，可高兴了！不过这地摊设备罕见，到底是买啥的呢？",
    
13. "粉丝摊。堆积如山的货量，不用愁没货！",
    
14. "鱼干摊。边晾晒边买卖，制作与赚钱互不相误。",
    
15. "糖果摊。吸引了那么多小朋友，摊主是妥妥的孩子王！",
    
16. "卖枣摊。摊主细心周到，份量都已经给您分好啦！",
    
17. "竹、草编器具摊。堆叠的这么高，非常引人注目！",
    
18. "理发摊。设备十足，理发师也非常有架势！",
    
19. "修脚摊。原来脚部按摩服务早就有了！",
    
20. "补鞋摊。摊主精心修补，生意稳赚不赔！",
    
21. "拔牙摊。直接硬拔，隔着屏幕都能感受到一丝痛意！",
    
22. "葫芦摊。一个藤上七个瓜，各具特色的小葫芦，任君挑选！",
    
23. "贴纸摊。出售各种手工剪纸，精美又有趣！",
    
24. "小玩具摊。摊主：你要啥样的？我可以立马编做！",
    
25. "花生摊。刚煮的花生，口感好极了！",
    
26. "水果摊。让人难以想象，这摊子竟然是摆在一百年前的天安门前！",
    
27. "盂类器具摊。缺痰盂、夜壶不？质量杠杠的，可以放心购买！",
    
28. "古玩摊。各种陶瓷、首饰应有尽有，摊主还是个小可爱！",
    
29. "挂饰摊。琳琅满目的小吊坠，非常吸引人！",
    
30. "服装摊。稍显凌乱，可能是只试不买的人太多了。",
    
31. "杂货摊。你想要的，这里都有，保证满足你的需求！",
    
32. "日常用品摊。锅碗瓢盆、拖把、水桶...走过路过别错过！",
    
33. "卖鞋摊。款式、尺码齐全，还可现场订做。",
    
34. "凉席摊。尺寸惊人，一百年前的床原来那么大！",
    
35. "卖布摊。漂白布、染色布、色织布...种类齐全。",
    
36. "贴身用品摊。耳罩、腰带、钱袋...一人、一竹竿就是一摊位",
    
37. "磨刀摊。人群密集，看来古人的“磨刀不误砍柴工”诚不欺我！",
    
38. "小玩意杂货摊。商品分类展列，可按需求选购。"];
    
39. var tIdx = 0;
    
40. var ttsText;
    
41. var showTxt = document.querySelector('#showTxt');
    
42. var ttsAudio = document.createElement('audio');
    
43.         ttsAudio.setAttribute('id', "tts_autio_id");
    
44.         ttsAudio.setAttribute("autoplay",true);
    
45.         ttsAudio.setAttribute('type', 'audio/mpeg');
    
46. 
    
47. function doTTS(){
    
48.          
    
49.         ttsText = picDesc[tIdx];
    
50.         showTxt.innerHTML = picDesc[tIdx];
    
51.         ttsAudio.setAttribute('src', 'http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=5&text='+ttsText);
    
52.     ttsAudio.play();
    
53.         tIdx++; tIdx %= picDesc.length;
    
54.         setTimeout(doTTS, 10000);
    
55. }
    
56. document.querySelector('#mp').onclick = function()        {
    
57. this.style.display = 'none';
    
58. doTTS();
    
59. }
    
60. </script>
    

复制代码

红枫

很成功，很完美，赞一个！
为你喝彩！

雄鹰翱翔

老师您好：前两天有事晚来了，欣赏您的佳作，赞一个！

195400

雄鹰翱翔 发表于 2021-10-16 08:12
老师您好：前两天有事晚来了，欣赏您的佳作，赞一个！