Php 仅在第一个元素上使用鼠标悬停播放视频

当鼠标悬停在div上时，将播放视频。一切正常，但视频只在第一个“播放器”上播放。我可以看到每个球员的缩略图，但他们没有开始比赛。为什么会这样

jQuery（文档）.ready（函数（）{
var vimeo=document.getElementsByClassName（'vimeo'）[0]；
var player=新的Vimeo.player（Vimeo）；
vimeo.onmouseover=函数（）{
返回player.play（）；
};
vimeo.onmouseout=函数（）{
返回player.pause（）；
};
});

问题是因为您只检索元素集合中的第一项（即

[0]

项）并将事件绑定到该项。其他元素均不受影响。要解决这个问题，您需要通过它们进行循环

我还建议为此使用

addEventListener（）

，而不是

onX

事件属性。试试这个：

jQuery（$=>{
from（document.getElementsByClassName（'vimeo'））.forEach（el=>{
let player=新的Vimeo.player（el）；
el.addEventListener（'mouseover'，（）=>player.play（））；
el.addEventListener（'mouseout'，（）=>player.pause（））；
});
});

没问题，很乐意帮忙