Question

我想知道如何才能将以下两个来源中的一个更改为webm，另一个更改为我的视频标记中的.mp4：

HTML：

    <video controls="controls" preload="auto" id="video" onclick="this.play();">
        <source src="fragmenten/real_schade.mp4" type="video/mp4"> </source>
        <source src="fragmenten/real_schade.webm" type="video/webm"> </source>
            Your browser doesn't support the video element.

    </video>

JQuery的：

var bvideo = document.getElementById('background');

$("#car").on('click', function(){
    bvideo.pause();
    showPlaceHolder();
    showVID();
    $("#video").attr("src","fragmenten/real_schade2.mp4");
    $('#video').attr("autoplay", "autoplay");
});

这只会直接在标记中插入一个来源，如何将我用视频标记提供的两个来源更改为.mp4和.webm，而不是将两个来源更改为一个来源/插入一个视频src进入标签

Answer 1

如果要在不更改文件扩展名的情况下动态替换所有源，可以执行以下操作：

$(document).ready(function () {
    changeVideoTo("fragmenten/real_schade2");
});

function changeVideoTo(name) {
    $("#video source").each(function () {
        var oldSource = $(this).attr("src");
        var fileExtension = oldSource.split(".")[1]
        $(this).attr("src", name + "." + fileExtension);
    });
}

小提琴： http://jsfiddle.net/beznbxqc/2/

Answer 2

$("#video source:nth-of-type(1)").attr('src', videoFile);
$("#video video")[0].load()

试试这个：

Answer 3

尝试使用此代码更改第一个来源：

$("#video source:first-of-type").attr("src","first/source.mp4");

这将改变第二个来源：

$("#video source:last-of-type").attr("src","first/source.webm");

我希望它有效：D

点击更改某些视频源

3 个答案: