「已注销」 2021-10-27 23:18 采纳率: 100%
浏览 322
已结题

请问怎么写自动播放下一个视频的脚本?

<script type="text/javascript" src="/jquery/jquery-1.11.3.min.js"></script>
<script>
    function resize_frame() {
        var nHeaderHeight = 100;
        $('#play_container').css('height', document.body.clientHeight - nHeaderHeight);
    }

    window.onresize = function () {
        resize_video();
        resize_frame();
    }

    window.onload = function () {
        resize_video();
        resize_frame();
    }

    function resize_video() {
        var nLeftWidth = 370;
        var nHeaderHeight = 79;
        $('#video').css('max-width', document.body.clientWidth - nLeftWidth);
        $('#video').css('max-height', document.body.clientHeight - nHeaderHeight);
    }

    $(function () {
        $('#player-container').bind('contextmenu', function () {
            return false;
        });
    })

</script>
<style>
    video::-internal-media-controls-download-button {
        display: none;
    }

    video::-webkit-media-controls-enclosure {
        overflow: hidden;
    }

    video::-webkit-media-controls-panel {
        width: calc(100% + 30px);
    }
</style>
您使用的浏览器版本过低,请升级浏览器以获得最佳体验
目录

        <p style="display:none;">
            <a class="header-title-bd">

            </a>
        </p>
    </div>

    <div class="header-title header-title2" style="line-height: 64px;color:#FFFF00">
        提示:视频资源防盗加密保护已启用,未经授权不得擅自使用,盗版、盗用、盗链必究。
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span><a href="../help/student_help_play.pdf" target="_blank">解决视频黑屏问题请点击这里</a></span>
        <!--通知:2019年8月20日下午14点开始服务器机房停电检修,部分视频可能不能正常播放,敬请谅解,预计恢复日期为8月21日。-->
    </div>

    <!--
    <div class="header-right">
        <span class="header-comment header-comment-text header-icon" title="评论"> 评论
         </span>
        <span class="header-comment header-comment-text header-icon" title="笔记"> 笔记
         </span>
    </div>
    -->
    <!--<div class="ke-mask"  ></div>-->
    <div class="ke-playlist" style="display:block">
        <div class="yc_main" id="ke-playlist">
            <div id="play-list" class="play-list nano" style="display: block">
                <div class="nano-content">
                    <div>
                        <div class="course-header">
                            <a class="link" target="_blank" id="course-name2" style="padding-left:1em;" href="">
                                返回课程首页
                            </a>
                            <img id="thumb-tack" style="cursor:pointer;height: 16px;width: 16px;margin-top:15px;vertical-align:middle;float: right;" src="images/thumb-tack-90.png" />
                        </div>
                        <div class="top-list" id="top-list">


                            <div class="chapter-list">
                                <div class="title js-chapter-course-title">
                                    <span class="chapter-title" title=""></span>
                                </div>
                                <ul class="chapter-course js-chapter-course">
                                    <li class="course-list"><i class="task-video"></i>
                                        <span class="course-list-header">
                                         <span class="title course-title js-course-title"
                                               title="" style="max-width: 214px;">正在努力加载中,请稍候...</span>
                                            <span class="tt-suffix js-tt-suffix"></span>
                                            <i class="toggle-icon icon-font icon-replay i-v-bottom"
                                               style="display: none;"></i>
                                        </span>
                                    </li>
                                </ul>
                            </div>
                            <!--q-repeat-->
                        </div>
                        <!--q-repeat-->
                    </div>
                    <!--q-repeat-->
                </div>
            </div>
        </div>
    </div>


</div>
<div class="live-container" style="padding-left: 350px" >
    <div class="player-container"  id="player-container">
        <!--加载框,-->
        <!--<div class="xa_container component-5"  id="ke-loading">-->
        <!--<div class="loading-zoom">-->
        <!--<div class="loading" style="color: white"></div>-->
        <!--</div>-->
        <!--</div>-->

        <div class="xb_main component-6" id="ke-pagerecorded">
            <div class="xc_container"  id="ke-vplayer">
                <div style="padding: 10px;box-sizing: border-box;outline: none">
                    <div id="video_div"  style="display: none">
                <video controls name="media" id="video" autoplay src="" controlslist="nodownload" style="background-color: rgb(0, 0, 0); width: 100%; height:auto; display: block;outline: none"></video>
                    </div>
                    <div id="iframe_div" style="display: none">
                        <iframe id="play_container" width="100%" height="600px" onresize="resize_frame()" onload="resize_frame()"></iframe>
                        <div id="play_status" style="color:#fff">PPT课件文件较大,加载较慢,请耐心等待,加载完成后请手动播放下一张幻灯片。</div>
                    </div>
                </div>
            </div>
        </div>
        <!--
            <video controls="controls" width="500px" height="300px" preload="metadata">
            <source src="video/FF4.ogv" type="video/ogg">
            <source src="video/FF4.webm" type="video/webm">
            <source src="video/FF4.mp4" type="video/mp4">
            <source src="video/FF4.f4v" type="video/x-f4v"> 这个是用于支持f4v的
        </video>
        -->
    </div>
</div>
  • 写回答

1条回答 默认 最新

  • CSDN专家-showbo 2021-10-28 09:31
    关注

    从贴出来的代码中没看出下一个视频的网址位置,下一个视频是在同一个网址播放的还是跳转到其他网页进行播放?
    最好发网址出来看下。如果是题主自己的网站要增加自动播放下一个的功能,给video对象添加onended事件自动播放下一个视频

    <video onended="this.src='下一个视频的网址'" controls name="media" id="video" autoplay src="" controlslist="nodownload" style="background-color: rgb(0, 0, 0); width: 100%; height:auto; display: block;outline: none"></video>
    
      
    
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 11月6日
  • 已采纳回答 10月29日
  • 创建了问题 10月27日

悬赏问题

  • ¥15 MATLAB动图问题
  • ¥15 有段代码不知道怎么理解,const isToken = (config.headers || {}).isToken === false
  • ¥100 采用栈和深度优先算法对我的代码进行修改显示路径
  • ¥15 pointnet2包安装
  • ¥20 射频功率问题,解答者有酬谢!
  • ¥80 构建降雨和积水的预测模型
  • ¥15 #Qt Transform setTransform()在鼠标拖动移动视角是一致在原地不动,无法变换视角(细微观察似乎视图有在原地抖动),无法变换视角(细微观察似乎视图有在原地抖动)
  • ¥50 如何利用无人机拍摄的数码照片测量鸟卵的长短径
  • ¥100 github贡献者给与奖励
  • ¥15 使用DS18B20+ESP8266获取温度数据返回-127.00