2016-07-05 4 views
1

В настоящее время у меня есть веб-страница с встроенным видеоизображением YouTube и наложением изображений, которое функционирует как кнопка воспроизведения. Я использую JavaScript для воспроизведения встроенного видео и скрыть изображение, когда пользователь нажимает на наложение изображения. Насколько мне известно, единственный способ сделать это - добавить «& autoplay = 1» к URL-адресу видео youtube.Как сохранить iFrame при автозапуске при нажатии кнопки «Назад»?

Кроме того, у меня есть форма на веб-странице, которую пользователь может отправить, чтобы отправить нам информацию. Если форма отправлена ​​правильно, она берет пользователя на страницу «спасибо». Проблема заключается в том, что пользователь нажимает кнопку «Назад» на странице благодарности. Поскольку я добавил «& autoplay = 1» в iFrame, видео продолжает воспроизводиться. Я попытался сбросить iFrame src, повторив JavaScript в другой части инструкции if/else, обрабатывающей форму. Кроме того, я не совсем уверен в этом, но я думаю, что кнопка back запускает метод .click(), поэтому я не уверен, как я буду препятствовать этому, если он будет рассматривать все как щелчок на кнопке. Я довольно долго задерживался на этом, и был бы признателен за какое-то возможное направление. Я также начинаю верить, что я хочу достичь, возможно, не совсем возможно.

Соответствующий код:

<?PHP 
    if(isset($_POST['submit'])) { 
     if($error) { 
      // handle form error 
     } 
     else { 
      // mails the form 
      header("location:http://mywebsite.com/thank-you"); 
     } 
    } 
?> 

<html> 
    <body> 
     <div id="video-thumbnail"> 
      <img id="video-image" src="norman.png" class="video-image" alt=""/> 
      <iframe id="video-embed" class="video-embed" frameborder="0" allowfullscreen="" src="https://www.youtube.com/embed/dQw4w9WgXcQ?rel=0&color=white&controls=1&loop=1&showinfo=0" s8011508427261248624="true" replaced="true" ></iframe> 
     </div> 

     <script> 
      (function($){ 
       $(document).ready(function(){ 
        $(".video-image").click(function(){ 
        $(".video-embed").css({"opacity":"1","display":"block"}); 
        $(".video-embed")[0].src += "&autoplay=1"; 
        $(this).unbind("click"); 
        }); 
       }); 
      })(jQuery) 
     </script> 

    </body> 
</html> 

ответ

0

Я решил свой собственный вопрос с помощью gaetanoM. Его ответ был прекрасен, это просто не хватает на одну строки, необходимой для сброса IFrame SRC в начале функции, чтобы избавиться от «& автозапуска = 1»

var backButtonPressed = false; 

$(function() { 
    $(".video-embed")[0].src = "https://www.youtube.com/embed/dQw4w9WgXcQ?rel=0&color=white&controls=1&loop=1&showinfo=0"; 
    if (window.history && window.history.pushState) { 

    window.history.pushState('forward', null, './#forward'); 

    $(window).on('popstate', function() { 
    backButtonPressed = true; 
    }); 
} 

$(".video-image").click(function() { 
    $(".video-embed").css({"opacity": "1", "display": "block"}); 

    // test if back button pressed 
    if (backButtonPressed == false) { 
     $(".video-embed")[0].src += "&autoplay=1"; 
    } 
    $(this).unbind("click"); 
    }); 
}); 
0

Вы можете обнаружить, если кнопка назад была нажата: если так не установлен автозапуск на видео.

var backButtonPressed = false; 

$(function() { 
    if (window.history && window.history.pushState) { 

    window.history.pushState('forward', null, './#forward'); 

    $(window).on('popstate', function() { 
     backButtonPressed = true; 
    }); 
    } 

    $(".video-image").click(function() { 
    $(".video-embed").css({"opacity": "1", "display": "block"}); 

    // test if back button pressed 
    if (backButtonPressed == false) { 
     $(".video-embed")[0].src += "&autoplay=1"; 
    } 
    $(this).unbind("click"); 
    }); 
}); 
+0

Я понимаю логику этого, и я искал то, что может попытаться это сделать; однако это не работает. Я думаю, это связано с тем, что автозапуск уже был добавлен в iFrame при первом щелчке, поэтому даже когда backButtonPressed == true, & autoplay = 1 уже был добавлен в iFrame при первом щелчке. Кнопка «Назад», похоже, не обновляет/перезагружает все. – derks

Смежные вопросы