Question

我的网站上有一个视频和一个按钮，可以将显示的视频与另一个视频进行交换。当我这样做时，它可以正常工作，但是在变化之后显示的第一个视频在后台播放（我可以在这里听到它的声音）。我想在它被替换之前暂停第一个视频/停止播放，但这不起作用。代码被完全替换，但为什么第一个视频仍然在后台播放？任何提示？谢谢！

<video id="video" controls="controls" autoplay="autoplay" loop="loop">
<source src="inc/1.mp4" type="video/mp4">
<source src="inc/1.webm" type="video/webm">               
</video>
<div class="video-active" movie="one">Active Video</div>


$(function() {
    $(".section-video-button").on("click", function() {
        document.getElementById('video').pause();
        if ($('.video-active').attr('movie') == 'one') {
            $('#video').replaceWith('<video id="video" controls="controls" autoplay="autoplay" loop="loop"><source src="inc/2.mp4" type="video/mp4"><source src="inc/2.webm" type="video/webm"></video>');
            $('.video-active').attr('movie','two');
        } else {
            $('#video').replaceWith('<video id="video" controls="controls" autoplay="autoplay" loop="loop"><source src="inc/1.mp4" type="video/mp4"><source src="inc/1.webm" type="video/webm"></video>');
            $('.video-active').attr('movie','one');
        }

        $('#video').load();
    });
 });

Answer 1

更新jQuery页面以包含播放和暂停视频的javascript / jQuery代码。

$("video").trigger("play");
$("video").trigger("pause");

Answer 2

尝试使用.html（）而不是使用replaceWith（），或只是更改SRC属性，插入整个代码。

您也可以尝试使用.stop（）函数。

使用JQuery / JavaScript暂停视频播放

2 个答案: