我试图用JQuery控制HTML5视频。我在一个选项卡界面中有两个剪辑，总共有六个选项卡，其他的只有图像。我试图使视频剪辑播放时，他们的标签被点击，然后停止时，任何其他被点击。
这一定是一个简单的事情要做，但我似乎不能让它工作，我使用的代码播放视频是:
$('#playMovie1').click(function(){
$('#movie1').play();
});
我读过，视频元素需要在一个函数中公开，以便能够控制它，但找不到一个例子。我能够使它工作使用JS:
document.getElementById('movie1').play();
任何建议都很好。谢谢
当前回答
我还做了这样的工作:
$(window).scroll(function() {
if($(window).scrollTop() > 0)
document.querySelector('#video').pause();
else
document.querySelector('#video').play();
});
其他回答
您的解决方案显示了这里的问题——play不是jQuery函数，而是DOM元素的函数。因此，您需要在DOM元素上调用它。您给出了如何使用本机DOM函数实现这一点的示例。jQuery的等效——如果你想这样做以适应现有的jQuery选择——将是$('#videoId').get(0).play()。(get从jQuery选择中获取原生DOM元素。)
我还做了这样的工作:
$(window).scroll(function() {
if($(window).scrollTop() > 0)
document.querySelector('#video').pause();
else
document.querySelector('#video').play();
});
我喜欢这个:
$('video').click(function(){
this[this.paused ? 'play' : 'pause']();
});
希望能有所帮助。
对于暂停多个视频，我发现这很有效:
$("video").each(function(){
$(this).get(0).pause();
});
这可以放入一个点击功能，这是相当方便的。
作为lonesomeday答案的延伸，你也可以用
$('#playMovie1').click(function(){
$('#movie1')[0].play();
});
注意，这里没有调用get()或eq() jQuery函数。用于调用play()函数的DOM数组。这是一条需要牢记的捷径。
