我正在使用jQuery事件处理一个网页，在该网页中，视频在鼠标悬停时播放，在鼠标离开时暂停：

$video.on("mouseover", function(e) {
  e.preventDefault();
  this.muted = true;
  this.play();
}).on("mouseout", function(e) {
  e.preventDefault();
  this.pause();
});

video元素具有poster属性。
这在Firefox和Chrome浏览器上运行良好。在Safari/13和Safari/15上也运行良好。但在Safari/14和Safari/12上，视频会消失。（播放时会重新出现，但暂停时会再次消失。）
如果我添加了“controls”属性，它仍然会显示鼠标释放时的控件，但是视频是空白的，所以我确信不是风格问题导致视频消失。
我不知道该如何修正这个问题。我试过使用mousenter/mouseleave事件来代替，并调整preload属性，但没有成功。