Не нравятся результаты поиска? Попробуйте другой поиск!
dle-faq.ru FAQ (все вопросы) jQuery Как вывести в span текст после отсчета таймера jQuery Countdown?

Как вывести в span текст после отсчета таймера jQuery Countdown?


     28.05.2016    jQuery    372

вопрос
Реализован таймер по примеру https://dle-faq.ru/blog/4872-countdown.html, только выводится не в li а в span (не так важно, но все-таки...). Задача вывести текст вместо нулей, когда таймер выйдет.
expiryText выводит текст только после того как таймер вышел, после обновления страницы возвращает значение 0.
Не знаю как организовать через onExpiry, чтобы после обновления страницы вместо 0 дней была надпись время вышло.
Помогите пожалуйста, второй день бьюсь!

Ответил: Gameer


1. Просто вставьте тег из инструкции в элемент span.
2. После
until: date,
вставьте
expiryText: 'ваш текст после окончания счетчика',

Комментарии пользователей (6)

peguckashady
10

peguckashady - 28 мая 2016 11:21 - Юзер

Не подходит... Счетчиков несколько.
Например:
Первый - осталось 1 день
Второй - осталось 0 дней
Смысл в том чтобы таймеры где время вышло выводили текст "Время вышло" постоянно, а expiryText выводит текст только после истечении срока, а после обновления страницы возвращает в 0.
Вроде как можно через onExpiry, но я не пойму как...

Gameer
226

1124 | 396

Gameer - 28 мая 2016 11:28 - Эксперт

peguckashady, После
until: date,
вставьте
onExpiry: timexpire,

Потом после скрипта вставьте
function timexpire()
{
$("#id").text("текст об окончании");
}

Где ID это ID нужного счетчика.

Истина в противоречии.​

peguckashady
10

peguckashady - 28 мая 2016 11:37 - Юзер

а можно прикрутить не к айди а к классу?
Таймер реализован для каждой новости определенной категории, и айди к нему не знаю как прикрутить) Извините за беспокойство, и спасибо за помощь!
ЗЫ Классный у Вас блог, частенько посещаю)

Gameer
226

1124 | 396

Gameer - 28 мая 2016 11:46 - Эксперт

peguckashady, вместо #id прописать .class где после точки название класса

Истина в противоречии.​

peguckashady
10

peguckashady - 28 мая 2016 12:55 - Юзер

Вопрос актуальный...
Скрипт
jQuery(document).ready(function($) {

    // для всех элеметов, которые имеют атрибут data-timer, выполняем следующее действие
    $("[data-timer]").each(function () {

        // текущий элемент, обернутый в jquery
        var $this = $(this);
        
        // Получаем описание таймера
        var timerDescription = $this.prop('title');
        // Если у элемента есть title - прибавляем к нему двоеточие и пробел
        if (timerDescription != false) {0
            timerDescription = timerDescription+': ';
        };

        // получили строку, разбили ее по ","
        var dateArr = $this.data("timer").split(" ");

        // элементы массива - строки, а для new Date нужны числа
        dateArr = $.map(dateArr, function (elem) {
            return parseInt(elem);
        });

        // в html пишем "человеческие" месяцы, здесь преобразуем к js-месяцам
        dateArr[1]--;        
        
        // конструируем даты
        var date = new Date(dateArr[0], dateArr[1], dateArr[2], dateArr[3], dateArr[4], dateArr[5]);    
        
        // инициализируем таймер
        $this.countdown({
            // Берё дату из заранее заготовленной
            until: date,
            format: 'd',
            //timezone: +180,
            // Определяем шаблон вывода
            layout:'{desc}'+ '{dn} {dl}',
            // Определяем описание
            description: timerDescription,
            onExpiry: timexpire,
            // Ну и про язык не забываем
        }, $.countdown.regional['ru']);
        

    });
    
    function timexpire(){$(".hasCountdown").text("текст об окончании");}

});

html
<span class="time" data-timer="[xfvalue_timer_year], [xfvalue_timer_month], [xfvalue_timer_day], 00, 00, 00"></span>

peguckashady
10

peguckashady - 28 мая 2016 12:56 - Юзер

***Комментарий удален***

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

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

 15.10.2011 AndreY_ZO_o  jQuery