Question

我目前正在使用最新版本的Jquery测试AJAX函数，并正在使用视频源对其进行测试。我想做的是通过一个按钮将当前视频源切换为新的视频源。

有índex.php，其中包含生成第一个视频源标签的PHP代码，还有load-videos.php，其代码几乎相同，唯一的区别是从Jquery文件main传递的AJAX变量.js。

$(document).ready(function(){   
let count = 1;
$("#c-video").click(function(){  
    count = count + 1;  
    let video = "v" + count + ".mp4";  

    $.ajax({
        url: video,
        type: "get"
    })
    .done(function(){
        var newData;
        /*$.post("load-videos.php",{
            nVideo: video
        },       
        function(data){
            if(data != newData)
                newData = data;
            $("video").html(newData);

        });*/


        $("video source").load("load-videos.php",{
            nVideo: video
        }, 
        function(response,status,xhr) {
            $("video source").replaceWith(response);
        });

    })
    .fail(function(jqXHR, textStatus, errorThrown){
        alert("Failed: File " + errorThrown);
    });

});
});

我正在使用$ .ajax函数检查文件是否存在，并且在.done内部存在问题，正是在这里，我正在尝试修改<source>标签中的<video>内容因此，我尝试了一些使用$ .post和load（）使其工作的尝试，但是都出错了，因为仅源代码中的页面结构没有视觉上的变化。

因此，如果我尝试检查Google Chrome上的代码，则会显示以下内容：

<source src="v1.mp4" type="video/mp4"> - If I click on button once
<source src="v2.mp4" type="video/mp4"> - If I click twice

但是正如我所说，没有任何视觉上的修改，所以我总是会每次看到页面中显示的第一个视频（上面的第一个资源）。

您能建议我这样做吗？因为唯一要加载的是后台代码。

更改视频标签的视频来源，而无需重新加载页面

0 个答案: