Question

基本上我有一个使用视频作为背景的网页。当用户点击链接（而不是按钮）时，视频需要更改为其他视频并播放。我需要在整个网站上这样做，因为它是一个动画叙事故事。

我一直在使用的代码：

HTML：

<div id="slide1">
    <p>Here is the first trigger. It should look something like this</p>
    <p></p>
    <a href="#" id="slide1to2">Next</a>
    </div>

    <div id="slide2" style="display: none;">Here is the second one</div>


</div>


<video id="video_background" preload="auto" autoplay loop> <source src="assets/video/street1.mp4" type="video/mp4" id="vidya">
</video>

Jquery的：

 $(function(){
    $('#slide1to2').click(function() {
      var src = "assets/video/street1.mp4";
       $("#video_background").find("#vidya").attr("src", assets/video/street2.mp4);
    });
});

无法弄清楚

Answer 1

忘记引用字符串：

attr("src", "assets/video/street2.mp4");

此外，您正在运行.find并查找带有ID的元素...只需使用ID并更改属性。

$("#vidya").attr("src", "assets/video/street2.mp4");

Answer 2

您需要将src的值包含在引号' '或双引号" "

中

$("#vidya").attr("src", "assets/video/street2.mp4");

但由于您已将值分配给src变量，因此您可以使用：

$("#vidya").attr("src",src);

请注意，id必须是唯一的，因此您只需使用$("#vidya")，而不是在此处应用冗余的.find()方法。

通过单击链接（JQuery）更改视频源

2 个答案: