0

Как сделать всплывающий текст на несколько секунд в ASP.NET c помощью JS?

Вот есть пустая форма и кнопка, после нажатия отображается некий текст, и скрывается через какой-то интервал.

Как должен выглядеть скрипт?

2 ответа 2

1

При нажатии на кнопку вместе с отображением текста устанавливайте таймаут, для его автоматического исчезновения после определенного времени. Вот пример обработчика события.

function hideText() {
   // логика сокрытия текста
}

function cliclHandler() { // обработчик клика по кнопке
   // тут некий код, исполняемый при нажатии на кнопку - показывает текст, например
   setTimeout(hideText, 1000); // через 1000 миллисекунд (1 секунду) выполнится hideText()   
}

Подробнее про setTimeout() можно прочитать здесь

0

Вот здесь показан работающий вариант решения проблемы с использованием всплывающих подсказок(popover) Bootstrap и jQuery. То есть к странице надо будет подключить таблицу каскадных стилей Bootstrap, его же Javascript и jQuery. Собственно HTML разметку формы можно посмотреть по ссылке, Javascript будет выглядеть во так:

$(function () {

    /// Наделяем все элементы с атрибутом data-toggle
    /// способностью отображать всплывающие подсказки.
    $('[data-toggle="popover"]').popover({ 
        animation: true, 
        delay: { "show": 300, "hide": 3000 }
    });

    /// При нажатии кнопки button показываем все подсказки.
    $('button').on('click', function(){
        $('[data-toggle="popover"]').popover('show');
    });


    /// После того, как все подсказки отобразились,
    /// запускаем таймер, по истечении времени которого
    /// срабатывает функция, скрывающая все подсказки
    $('[data-toggle="popover"]').on('shown.bs.popover', function () {

        setTimeout(function(){ 
            $('[data-toggle="popover"]').popover('hide'); 
        }, 2000); 

    });

})

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.