Сладкое предупреждение. Отображение обратного отсчета в поле оповещения

Question

У меня проблема с отображением обратного отсчета в сообщении sweetalert. После щелчка я использую сообщение «A с автоматическим таймером закрытия». Я хочу, чтобы этот обратный отсчет был в сообщении, и пользователь может видеть обратный отсчет.

swal({ 
    title: "Please w8 !", 
    text: "Data loading...", 
    timer: 10000, 
    showConfirmButton: false 
}); 

Answer 1

Нельзя делать с SweetAlert. Он не поддерживает подсчет пользовательского интерфейса. Но никогда не говори никогда :-)

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

var 
    closeInSeconds = 5, 
    displayText = "I will close in #1 seconds.", 
    timer; 

swal({ 
    title: "Auto close alert!", 
    text: displayText.replace(/#1/, closeInSeconds), 
    timer: closeInSeconds * 1000, 
    showConfirmButton: false 
}); 

timer = setInterval(function() { 

    closeInSeconds--; 

    if (closeInSeconds < 0) { 

     clearInterval(timer); 
    } 

    $('.sweet-alert > p').text(displayText.replace(/#1/, closeInSeconds)); 

}, 1000); 

Результат:

Answer 2

Вот лучшее решение

var timer = 10, // timer in seconds 
    isTimerStarted = false; 

(function customSwal() { 
    swal({ 
     title: "Please w8 !", 
     text: "Data loading..." + timer, 
     timer: !isTimerStarted ? timer * 1000 : undefined, 
     showConfirmButton: false 
    }); 
    isTimerStarted = true; 
    if(timer) { 
     timer--; 
     setTimeout(customSwal, 1000); 
    } 
})();