@AlexWD

Как сделать смену содержимого ссылки из массива?

Добрый день!
В моём JQuery скрипте есть обработчик видеоплеера, при загрузке страницы подгружается три видеоролика, по окончании первого ролика вставляется следующий и так пока цикл не повторится. Нужно немного модифицировать код так, чтобы по окончании каждого ролика менялась ещё и ссылка на него из того же массива, как это можно сделать?
Тут код, который работает сейчас:
$(document).ready(function() {
    var i = 0;
    var sources = ['https://site.com/video/home/2.mp4', 'https://site.com/video/home/3.mp4', 'https://site.com/video/home/maestron.mp4'];
	var srcsb = $('.homevideobannwr a');
    $('#videoElement').bind('ended', function() {
        this.src = sources[i++ % sources.length];
        this.load();
        this.play();		    
    });
});


Тут код, который я пытался сделать сам:
$(document).ready(function() {
    var i = 0;
	var srcss = ['https://site.com/featured-products/', 'https://site.com/featured-products/3', 'https://site.com/featured-products/2'];
    var sources = ['https://site.com/video/home/2.mp4', 'https://site.com/video/home/3.mp4', 'https://site.com/video/home/maestron.mp4'];
	var srcsb = $('.homevideobannwr a');
    $('#videoElement').bind('ended', function() {
        this.src = sources[i++ % sources.length];
		srcsb.src = srcss[i++ % srcss.length];
        this.load();
        this.play();		    
    });
});


HTML Код:
<div class="homevideobannwr">
<a href="https://site.com/featured-products/"><div class="homevideobann"><video src="https://site.com/video/home/2.mp4" id="videoElement" autoplay="" muted=""></video></div></a>
</div>
  • Вопрос задан
  • 55 просмотров
Решения вопроса 1
CbIPoK2513
@CbIPoK2513
Front-end
Храним данные в массиве объектов и ходим по ним, допустим такой вариант:

let VideoBanner = [
  {
    videoSrc: 'ССЫЛКА НА ВИДЕО',
    bannerLink: 'ССЫЛКА НА ЧТО-ТО ДРУГОЕ'
  }
];


Код переключения вообще не годится, написал следующий вариант:

let videoEmbed = $('#videoElement')[0],
  videoLinkEl = $('.homevideobannwr > a');
  videoCurrent = 0;

function VideoPlay() { // Запускаем функцию
  let curObj = VideoBanner[videoCurrent]; // Получаем данные данные текущей позиции "плейлиста"
  videoLinkEl.attr('href', curObj.bannerLink); // Меняем ссылку
  //
  videoEmbed.src = curObj.videoSrc; // Меняем ссылку у видео
  videoEmbed.onended = function(){ // Когда видео закончится, сработает эвент
    videoCurrent = videoCurrent+1 < VideoBanner.length ? videoCurrent+1 : 0; // Тут мы меняем позицию (Если след. позиция МЕНЬШЕ длины плейлиста, то применяем позицию, если НЕТ, то начнём с нуля.
    VideoPlay(); // И запускаем заного функцию
  };
} VideoPlay();


Демо
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы