2-я функция jQuery Отмена 1-го - PullRequest
Новая
       14

2-я функция jQuery Отмена 1-го

1 голос
/ 10 июня 2019

Я попробовал сам, правда.Читай тонны постов на форуме, пробовал кодовые ручки, скрипки и все такое. Я, по сути, потратил 3 дня.Я работаю над сайтом клиента, поэтому время имеет большое значение.Я знаю, что здесь есть замечательные кодеры.

Я реализовал код jquery, чтобы мои видео перестали воспроизводиться при закрытии модального режима.Вот этот код: 

jQuery(document).ready(function($){
    $('.modal').on('hide.bs.modal', function() {
        var memory = $(this).html();
        $(this).html(memory);
    });
});

(я использую Wordpress, поэтому я должен сделать первую строчку подобным образом.)

В любом случае, это работало отлично, видео перестает воспроизводиться, когда вызакрой модал.Но затем я захотел использовать изображение для постера, и чтобы избежать громоздкого двойного щелчка, ему нужно отложить автозапуск (останавливает автоматическое воспроизведение видео при загрузке страницы, ждет, пока не будет нажато изображение плаката.) Вот код, который я всегда использую длячто: 

jQuery(document).ready(function( $ ){
    $('.vidposter').on('click', function() {
    var element = $(this);
    var videoSRC = element.attr('data-videoSRC');
    var iframe = '<iframe width="700" height="394" src="'+videoSRC+'"></iframe>';
    element.html(iframe);
    });
});

Если вам нужно это увидеть, вот HTML: 

  <div align="center"><div class="vidposter" data-videoSRC="https://player.vimeo.com/video/123456789?autoplay=1"><img src="http://blahblahsite.com/images/image.jpg" style="cursor:pointer"></div></div>

ПРОБЛЕМА:

Обе части jquery прекрасно работают в одиночку.Когда я загружаю второй скрипт, он игнорируется.Или когда я пытаюсь комбинировать одну, вторая функция не срабатывает.

Моя попытка объединения: 

jQuery(document).ready(function($){

    $('.vidposter').on('click', function() {
        var element = $(this);
        var videoSRC = element.attr('data-videoSRC');
        var iframe = '<iframe width="700" height="394" src="'+videoSRC+'"></iframe>';
        element.html(iframe);
    });

    $('.modal').on('hide.bs.modal', function() {
        var memory = $(this).html();
        $(this).html(memory);
    });
});

Я неправильно их комбинирую ??Нужно ли что-то переписывать?

К вашему сведению: что происходит, когда работает «vid poster + defer autoplay», но «остановка видео при модальном закрытии» не только игнорируется, но и начинается заново с самого начала.

1 Ответ

0 голосов
/ 10 июня 2019

Один из ваших кодов использует теги video для видео, а другой использует теги iframe для видео.

первый хочет приостановить тег video второго, но второй используетВместо этого iframe.

они несовместимы друг с другом.приостановка видео с тегами video отличается от тегов iframe.

Для остановки видео необходимо проверить, является ли оно iframe или normal video.и остановите видео для каждого случая отдельно.

Поэтому измените: 

    var memory = $(this).html();
    $(this).html(memory);

на: 

if($(this).find('iframe')[0]){
        var iframe = $(this).find('iframe')[0];
        try{
          var vid = $(iframe).contents().find(this)[0];
          if (vid) {vid.pause();vid.currentTime = 0;}
        }catch(e){console.log(e);}
        //for vimeo videos
        if(iframe.contentWindow)iframe.contentWindow.postMessage('{"method":"unload"}', '*');
    }
    else if($(this).find('video')[0]){
        var memory = $(this).html();
        $(this).html(memory);
    }

также, если вы хотите сделать паузу вместо остановки, удалите vid.currentTime = 0;и измените "method":"unload" на "method":"pause"

...