zoukankan      html  css  js  c++  java
  • JavaScript一个页面中有多个audio标签,其中一个播放结束后自动播放下一个,audio连续播放

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <title>一个页面中有多个audio标签,其中一个播放结束后自动播放下一个,audio连续播放</title>
    </head>
    
    <body>
        <audio src="http://www.ytmp3.cn/down/49366.mp3" controls></audio>
        <audio src="http://www.ytmp3.cn/down/49382.mp3" controls></audio>
        <audio src="http://www.ytmp3.cn/down/49369.mp3" controls></audio>
        <script type="text/javascript">
        var audios = document.getElementsByTagName("audio");
        for (var i = 0; i < audios.length; i++) {
            // console.log("audios "+i+"  SRC:" + audios[i].currentSrc);
            audios[i].addEventListener('ended', function() {
                // nextSibling 属性返回指定节点之后紧跟的节点,在相同的树层级中。
                var nextAudio = this.nextSibling.nextSibling;
                // tagName 属性返回元素的标签名。(大写)
                if (nextAudio.tagName == "AUDIO") {
                    nextAudio.play();
                }
            }, false);
        }
        </script>
    </body>
    
    </html>
  • 相关阅读:
    Linux下用wget下载百度网盘资源
    android系统编译记录
    ubuntu 安装JDK & eclipse
    Linux安全攻略-僵尸进程
    smack user登陆
    smack 创建账户
    我的第一个开源App(彩票开奖查询)
    REST简介
    HTTP 状态码
    测试 ScribeFire Blog Editor
  • 原文地址:https://www.cnblogs.com/huanghuali/p/9336002.html
Copyright © 2011-2022 走看看