Question

以下php在我的页面上以“ .videos”类名称输出各种视频：

<?php
wp_video_shortcode($attr, $content);    
?>

每个视频生成的代码如下：

<video class="videos" poster="/poster.png" preload="none" controls="controls">
  <source type="video/mp4" src="/VideoPreview_04.mp4?_=1">
</video>

以下jquery用于删除视频控件，并使每个控件在鼠标悬停时播放，并在鼠标悬停时暂停：

<script type="text/javascript"> 
  jQuery(document).ready(function() {
    jQuery(".videos").removeAttr("controls");

    jQuery(".videos").on("mouseover", function(event) {
      this.play();
    }).on('mouseout', function(event) {
      this.pause();
    });
  });
</script>

问题：

除了第一次加载页面时，所有操作都应该正常进行，除非并且直到您首先单击页面上的某个位置，否则鼠标悬停事件不会被识别。

我确定这与委派或类似的事情有关。以下示例在页面加载时起作用，而无需先单击页面上的某处：

jQuery(document).on('focus mouseover', '.videos',  function(e){
  alert("focused on " + jQuery(e.target).attr('id'));
});

但是，将视频绑定到上述代码时，除非再次单击该页面，否则视频不会起作用。

我也尝试过document.focus（）;以及其他专注于各种元素但无法使其发挥作用的方法。

帮助，我的头发快用完了：（

jQuery事件不会在初始页面加载时触发

0 个答案: