Question

我试图通过点击视频或通过按钮来切换背景视频的暂停/播放。我设法让视频点击触发器工作，但无法弄清楚如何处理按钮部分。我学习jquery所以还是有点新手！

这是我到目前为止所得到的：

$("video").trigger("play");//for auto play
$("video").addClass('pause');//for check pause or play add a class
$('video').click(function() {
if ($(this).hasClass('pause')) {
 $("video").trigger("play");
 $(this).removeClass('pause');
 $("#artwork").removeClass('fadein')
 $(this).addClass('play');
 pauseButton.innerHTML = "Pause";
} else {
 $("video").trigger("pause");
 $(this).removeClass('play');
 $(this).addClass('pause');
 $("#artwork").addClass('fadein');
 pauseButton.innerHTML = "Paused";
}
});

任何帮助表示赞赏！干杯

Answer 1

据我了解，即使在视频上你已经处理了点击，它也能正常工作。所以只需对你的pauseButton做同样的事情。将与点击相关的代码移动到某个功能，并将其绑定为您想要的任何触发器的回调 - 单击视频，单击按钮等。因此，最低限度地更新您的代码：

function toggleVideo() {
  if ($(this).hasClass('pause')) {
    $("video").trigger("play");
    $(this).removeClass('pause');
    $("#artwork").removeClass('fadein')
    $(this).addClass('play');
    pauseButton.innerHTML = "Pause";
  } else {
    $("video").trigger("pause");
    $(this).removeClass('play');
    $(this).addClass('pause');
    $("#artwork").addClass('fadein');
    pauseButton.innerHTML = "Paused";
  }
};

$('video').click(toggleVideo); // handle click on video
// assuming pauseButton references your play/pause button
$(pauseButton).click(toggleVideo); // handle click on button
$("video").trigger("play"); // for auto play
$("video").addClass('pause'); // for check pause or play add a class

Jquery视频按钮触发问题

1 个答案: