改进HTML5视频和jQuery代码以提高效率

Question

我的网页上有5个视频.只有当您将鼠标悬停在视频上时才会开始播放.我的代码如下:

$(".service:nth-child(1) a").hover(function(){
    $('.service:nth-child(1) a video#bgvid').get(0).play();
},function(){
    $('.service:nth-child(1) a video#bgvid').get(0).pause();
});

我曾经使用过,:nth-child因为如果我将鼠标悬停在视频4上,它会播放视频1,所以我必须具体.这意味着我必须为每个视频重复上述代码,但相应地更改:nth-child数字.我对JS不是特别熟练,但必须有更好,更有效的方法吗？

Answer 1

未经测试，但this应该可以帮助您入门。哈，双关语。 this。得到它？

$('.service a').hover(function(){
  $(this).children('video').get(0).play();
}, function(){
  $(this).children('video').get(0).pause();
});

另请参阅： /sf/answers/1991074081/