Как проще всего вызывать функцию каждые 5 секунд в jQuery?
Описание проблемы:
Здравствуйте!
Мне нужно реализовать автоматическое переключение изображений в слайдшоу с помощью jQuery. Я хочу, чтобы функция выполнялась каждые 5 секунд, но не хочу устанавливать сторонние плагины, если это возможно.
Буду признателен за любые советы или примеры, как это можно сделать. Заранее спасибо!
5 ответ(ов)
Для этого не нужна jQuery, можно использовать чистый JavaScript. Вот так будет работать:
var intervalId = window.setInterval(function(){
// вызовите вашу функцию здесь
}, 5000);
Чтобы остановить цикл, используйте:
clearInterval(intervalId);
Вы можете зарегистрировать интервал на странице, используя функцию setInterval, а именно:
setInterval(function(){
// здесь размещайте код, который будет выполняться каждые 5 секунд.
}, 5000);
Этот код создаст интервал, который будет вызывать указанную функцию каждые 5000 миллисекунд (или каждые 5 секунд).
Вот хороший пример, где можно использовать setInterval() для создания бесконечного цикла и clearInterval() для его остановки:
function everyTime() {
console.log('каждую секунду...');
}
var myInterval = setInterval(everyTime, 1000);
Чтобы остановить этот цикл, вызовите следующую строку:
clearInterval(myInterval);
Таким образом, вы можете начать выполнение функции каждую секунду и остановить её при необходимости, вызвав clearInterval().
Вот небольшой совет для первого ответа. Если ваша функция уже определена, ссылайтесь на неё, но не вызывайте её!!! То есть, не ставьте скобки после имени функции. Так будет правильно:
my_function(){};
setInterval(my_function, 10000);
Функции, упомянутые выше, выполняются независимо от того, закончилась ли их предыдущая инвокация, в то время как эта функция запускается каждые x секунд после завершения выполнения.
// IIFE (Immediately Invoked Function Expression)
(function runForever(){
// Выполняем необходимые действия здесь
setTimeout(runForever, 5000) // Запускаем саму себя через 5 секунд
})()
// Обычная функция с аргументами
function someFunction(file, directory){
// Выполняем необходимые действия здесь
setTimeout(someFunction, 5000, file, directory) // Запускаем эту функцию через 5 секунд, передавая аргументы
// ДА, setTimeout передает любые дополнительные аргументы
// в вызываемую функцию
}
Таким образом, первая функция runForever будет бесконечно выполняться каждые 5 секунд, независимо от завершения предыдущего вызова, а функция someFunction будет перезапускаться также каждые 5 секунд, но только после того, как предыдущий вызов завершится, и будет сохранять переданные ей аргументы.
Как перенаправить на другую веб-страницу?
Прокрутка к элементу с использованием jQuery
Как определить нажатие клавиши Esc?
Как получить данные формы с помощью JavaScript/jQuery?
Как выполнить код после сброса HTML-формы с помощью jQuery?