События jQuery не запускаются при начальной загрузке страницы - PullRequest
0 голосов
/ 24 августа 2018

Следующий 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 ();и другие способы сфокусироваться на различных элементах, но не могут заставить его работать.

Помогите, у меня кончились волосы, чтобы вытащить: (

...