通过使用JQuery，当鼠标输入一次时如何播放视频并在鼠标输入两次时暂停视频？

I want to achieve the effect that when the user's mouse enters into the video frame, it will trigger the movie. Also, when the user's mouse leaves the video, it will still continue to play.

我想达到这样的效果：当用户的鼠标进入视频帧时，它将触发电影。此外，当用户的鼠标离开视频时，它仍将继续播放。

However, when the user's mouse enters into the video frame again, the video will be paused. Is there any way to achieve this? I am new to this field.

但是，当用户的鼠标再次进入视频帧时，视频将暂停。有没有办法实现这个目标？我是这个领域的新手。

Here is what I have so far :

JQuery:

JQuery的：

$(document).ready(function(){
   $('#video1').mouseover(
        function()
            {
                $(this).get(0).play();
            }
        );
    });

HTML:

HTML：

<video id = "video1" width = "420">
    <source src = "lololol.mp4" type = "video/mp4">
</video>

2 个解决方案

#1

Just check the state of the video. And use the mouseenter event instead.

只需检查视频的状态即可。并使用mouseenter事件。

$('#video1').mouseenter(
   function()
   {
      if($(this).get(0).paused)
          $(this).get(0).play();
      else
          $(this).get(0).pause();
   }
);

#2

You'll probably want to create a variable, increment it on mouseenter, and check its value for even or odd:

您可能想要创建一个变量，在mouseenter上增加它，并检查其值是偶数还是奇数：

var movieHoverCt = 0;

$('#video1').mouseenter(function () {
    if (movieHoverCt % 2 === 0) { // even
        $(this).get(0).play();
    } else { // odd
        $(this).get(0).stop();
    }
    movieHoverCt++;
});

#1