我们现在需要使用JQuery动态改变source标签的src路径:
$('.video_cover').click(function () {
var getAttr = $(this).prev().children('source').attr('src');//获取到另外一个视频的路径
var sourceDom = $("<source src=\"" + getAttr + "\">");//将刚才获取到的 getAttr 视频路径动态赋值给source
$(".video_bg_white video").html(sourceDom);
$('.video_bg_white video').trigger('play');
});
这样写看起来没啥问题,调试器里也能看到效果,但是,页面并没有渲染改变后的结果,还是之前的数据。
所以,我们现在给后面加一个 load();方法:
$(".video_bg_white video").html(sourceDom).load();
这次就可以在页面上就可以看到动态改变之后的视频效果了。