Какое решение этой ошибки?

Question

У меня есть Javascript файл - я знаю, что код довольно грязный прямо сейчас, но я просто кодирую некоторые основные функции, а что нет, тогда я очищу код. Страница состоит из трех разделов внутри этих трех отдельных разделов - это фотографии. Изображения должны меняться каждые 30 секунд. Что вызывает эту ошибку?

Ошибка выводится на консоль: TypeError: не определено не является объектом (оценка 'document.images [1] .src = изображения [альтернативный]')

Вот код:

var alternate = 0; 
var timerId; 
var images = ["img/s1.jpg", "img/tourism.jpg", "img/s2.jpg", "img/shopping.jpg", "img/dining.jpg", "img/shopping2.jpg", "img/s3.jpg"]; // Image URLs in a image array 

function startAnimation() { 

    var now = new Date(); 
    var hours = now.getHours(); 
    var minutes = now.getMinutes(); 
    var seconds = now.getSeconds(); 
    var meridian = "AM"; 
    var time = hours + ":" + minutes + ":" + seconds + " " + meridian; 

    if (hours < 12 && meridian == "PM" || hours == 0) { 
     hours = hours + 12; 
     meridian == "AM"; 
     time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
    } else if (hours > 12 && meridian == "AM") { 
     meridian = "PM"; 
     hours = hours - 12; 
     time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
    } 
    //hours < 12 ? meridian : "AM"; 

    // comment on code here. 
    if (minutes < 10) { 
     minutes = "0" + minutes; 
     time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
    } 

    // comment on code here. 
    if (seconds < 10) { 
     seconds = "0" + seconds; 
     time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
    } 

    //alternate = (alternate == 0) ? 1 : 0; // Alternate images 

    if (alternate == 0) { 
     alternate = 3; 
    } else { 
     alternate = 0; 
    } 

    if (alternate == 1) { 
     alternate = 2; 
    } else { 
     alternate = 1; 
    } 

    //document.images[0].src = images[alternate]; // Update image 
    document.images[1].src = images[alternate]; 
    timerId = setTimeout("startAnimation()", 30000); // 30 second update 

    if (images[alternate] == images[0]) { 
     console.log(time + " " + images[0] + " has been loaded."); 
    } 

    if (images[alternate] == images[3]) { 
     console.log(time + " " + images[3] + " has been loaded."); 
    } 

    if (images[alternate] != images[0] || images[alternate] != images[3]) { 
     console.log("Please wait while the debugging process is in effect."); 
    } 

} 

startAnimation(); 

Answer 1

Вот рабочий код. Произошла ошибка: неправильная реализация setTimeout() и неправильный оператор присваивания, который вы использовали.

var alternate = 0; 
 
var timerId; 
 
var images = [ 
 
    "img/s1.jpg", 
 
    "img/tourism.jpg", 
 
    "img/s2.jpg", 
 
    "img/shopping.jpg", 
 
    "img/dining.jpg", 
 
    "img/shopping2.jpg", 
 
    "img/s3.jpg" 
 
]; // Image URLs in a image array 
 

 
function startAnimation() { 
 

 
    var now = new Date(); 
 
    var hours = now.getHours(); 
 
    var minutes = now.getMinutes(); 
 
    var seconds = now.getSeconds(); 
 
    var meridian = "AM"; 
 
    var time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
 

 
    if (hours < 12 && meridian == "PM" || hours === 0) { 
 
    hours = hours + 12; 
 
    meridian = "AM"; 
 
    time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
 
    } else if (hours > 12 && meridian == "AM") { 
 
    meridian = "PM"; 
 
    hours = hours - 12; 
 
    time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
 
    } 
 
    //hours < 12 ? meridian : "AM"; 
 

 
    // comment on code here. 
 
    if (minutes < 10) { 
 
    minutes = "0" + minutes; 
 
    time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
 
    } 
 

 
    // comment on code here. 
 
    if (seconds < 10) { 
 
    seconds = "0" + seconds; 
 
    time = hours + ":" + minutes + ":" + seconds + " " + meridian; 
 
    } 
 

 
    //alternate = (alternate == 0) ? 1 : 0; // Alternate images 
 

 
    if (alternate === 0) { 
 
    alternate = 3; 
 
    } else { 
 
    alternate = 0; 
 
    } 
 

 
    if (alternate == 1) { 
 
    alternate = 2; 
 
    } else { 
 
    alternate = 1; 
 
    } 
 

 
    //document.images[0].src = images[alternate]; // Update image 
 
    document.images[0].src = images[alternate]; 
 
    timerId = setTimeout(startAnimation(), 30000); // 30 second update 
 

 
    if (images[alternate] == images[0]) { 
 
    console.log(time + " " + images[0] + " has been loaded."); 
 
    } 
 

 
    if (images[alternate] == images[3]) { 
 
    console.log(time + " " + images[3] + " has been loaded."); 
 
    } 
 

 
    if (images[alternate] != images[0] || images[alternate] != images[3]) { 
 
    console.log("Please wait while the debugging process is in effect."); 
 
    } 
 

 
} 
 

 
startAnimation();

<img src="" alt="">

Answer 2

Yo есть несколько опечаток и ошибок:

meridian == "AM"; 

должен быть meridian = "AM";

Также

timerId = setTimeout("startAnimation()", 30000); 

Должно быть:

setTimeout(startAnimation, 30000);