JQuery play/pause HTML5 视频速度慢

Question

我有一个 HTML5 视频，当您点击视频的任意位置时，我想 play/pause。我在下面编写的代码有效，但如果我点击视频几次，它就会开始变慢，有时甚至会卡住。我将选择器保存在变量中，希望能解决这个问题，但它并没有产生明显的区别。我的代码中是否存在我未发现且控制台未检测到的错误？还是有更好的方法来编写它，这样它就不会那么慢？顺便说一下，intro-vid ID 在 HTML.

中的 <video> 元素上

var $video = $('video')[0];
var $introVid = $('#intro-vid');

// If the video is playing, pause it when clicked
$introVid.on('play', function() {
    $introVid.click(function() {
        $video.pause();
    });
});

// If the video is paused, play it when clicked
$introVid.on('pause', function() {
    $introVid.click(function() {
        $video.play();
    });
});

编辑：这是 HTML

<video id="intro-vid" controls>
    <source src="placeholder.mp4" type="video/mp4">
    <source src="placeholder.webm" type="video/webm">
        Your browser does not support the video tag.
</video>

Answer 1

您不应该在其他处理程序中绑定事件处理程序，这样它们会迅速增加，造成麻烦。试试这个：

var $video = $('video')[0];
var $introVid = $('#intro-vid');

$introVid.click(function () {
    $video.paused ? $video.play() : $video.pause();
});

JQuery play/pause HTML5 视频速度慢

JQuery play/pause on HTML5 video is slow

javascript

jquery

html5-video