如何使用jQuery引用HTML5视频元素？

Question

鉴于此标记

<p><a href="#">LOAD VIDEO</a></p>

<video id="video" controls width="560">
    <source id="webm" type="video/webm" />
    <span>zoom-club.webm</span>
</video>

而这个脚本

$(document).ready(function(){

    $('a').on('click',function(){

        var path = "../assets/" + $('span').text();

        $('source').attr('src', path);

        $('video#video').load();
        $('video#video').play();

    });

});

为什么会出现此错误？

Uncaught TypeError: undefined is not a function

这实际上可以使用传统的Javascript和getElementById起作用，但是由于某些原因，我引用视频标签的方式已损坏。 是什么赋予了？

Answer 1

您收到此错误的原因是

$('video#video')

给你一个jQuery对象。 但是它没有play()方法。

因此，您需要从中提取DOM对象：

$('video#video')[0]

现在，您可以调用play() ：

$('video#video')[0].play();