Удалить или изменить параметр src по клику

305

11 марта 2017, 02:46

Здравствуйте.

Подскажите, как изменить или удалить параметр src по клику? При открытии скрытого блока включается видео, но при закрытии оно продолжает воспроизводиться.

Этим кодом я запускаю видео. Подскажите, как при закрытии окна его остановить.

$(document).on('click', '.open-video', function() {
  var $video = $('#video'),
  src = $video.attr('src');
  $video.attr('src', src + '?autoplay=1');
});

Пробовал добавить при клике на кнопку

$(document).on('click', '.open-video', function() {
  var $video = $('#video'),
  src = $video.attr('src');
  $video.attr('src', src + '?pause=1');
});

Но при повторном открытии видео не запускается, в ссылке остаются оба параметра, как удалить ?autoplay=1?

Answer 1

Для запуска видео используйте:

$video.get(0).play()

Для паузы:

$video.get(0).pause()

Заметьте, что play() и pause() это не функции jQuery, поэтому чтобы перейти в DOM-элемент используется get()

Answer 2

Можно заранее очищать ссылку от переменных

$(document).on('click', '.open-video', function() { 
  var $video = $('#video'), 
      src = $video.attr('src').replace(/^(.+)\?.+$/, '$1'); 
       
  $video.attr('src', src + '?pause=1'); 
   
  console.log( $video.attr('src') ); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<video src="video.mp4" id="video"></video> 
 
<button class="open-video">Изменить</button>