Javascript автоматически воспроизводит изображения в случайном порядке со ссылками

Я пытаюсь сделать серию изображений автоматически воспроизводимой на веб-сайте через Javascript (где порядок / последовательность, которую они воспроизводят, каждый раз случайны). Я также пытаюсь сделать так, чтобы в некоторых из этих изображений были гиперссылки, которые перенаправляли на разные сайты.

Мое понимание JS очень ограничено. Я искал в Интернете различные подходы и методы, чтобы добраться туда, где я нахожусь, но JS, который я придумал, не работает.

Вот что у меня сейчас есть:

var imgLinks = [
// format: ['imageSource','imageLinkURL'],
  ['1.jpg','https://example.com'],
  ['2.jpg','https://www.google.com'],
  ['3.jpg','https://www.yahoo.com'],
  ['4.jpg','https://www.bing.com'],
  ['5.jpg','https://ddg.gg']
  // NOTE: no comma after last entry
];


function displayImage(){
  var num = Math.floor(Math.random() * (imagesArray.length));
  if (!usedImages[num]){
    document.canvas.src = imagesArray[num];
    usedImages[num] = true;
    usedImagesCount++;
    if (usedImagesCount === imagesArray.length){
        usedImagesCount = 0;
        usedImages = {};
    }
  } else {
    displayImage();
  }
}
window.onload = function() {
  setInterval(changeBanner, 300)

  function GoToURL(URL) {
    document.location.href = URL; 
  }

  onload = function () {
    RandomLink();
  }
};

Любая помощь будет принята с благодарностью, спасибо!

Вы нигде не определили функцию RandomLink и назначили функцию, вызывающую ее, глобальному свойству в процессе после загрузки документа, так что в любом случае вызывать ее уже слишком поздно. Функция GoToURL не вызывается в прослушивателе загрузки и не может быть вызвана иначе.

RobG 05.09.2018 05:40
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
1
41
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете использовать эту функцию:

function RandomLink(arr){
  var index = Math.floor(Math.random() * arr.length);
  return arr[index];
}

с arr это ваш imgLinks

Пожалуйста, проверьте эта рабочий пример

Другие вопросы по теме