Блог

Главная - Вопросы по программированию - скройте сообщение через 3 секунды, и мой код отобразится несколько раз

скройте сообщение через 3 секунды, и мой код отобразится несколько раз

#javascript #jquery

Вопрос:

Я выполняю вызов ajax, и когда я пытаюсь отправить, в моем поле ввода появляется другой раздел под ним и отображается ошибка, но если я нажимаю кнопку слишком много раз, она продолжает добавлять новые сообщения одно под другим

а также я хочу скрыть сообщение через 3 секунды

итак, в основном две проблемы в моем коде

 $.ajax({
            url : $('##frm').attr('data-action'),
            type: 'post',
            data: $('##frm').serialize(),
            success: function(data) {
                if (data.indexOf("emailissue") > -1) {
                    $("##emailaddress").parent().after("<div class='validation' style='color:red;font-size:0.90em;'>Please Provide valid email address</div>");
                    $('##validation').delay(3000).fadeOut();
                }else{
                    $("##ID").show().delay(5000).fadeOut();
                    $("##ID").css('display','none');
                }
             }
        });

html выглядит примерно так

 <div class="form-group">
                      <label for="emailaddress">We are missing you email, please enter below</label>
                      <input type="text" name="emailaddress" id="emailaddress" placeholder="Enter your email" class="form-control">
                    </div>

Ответ №1:

Попробуйте установить элемент статического ответа в DOM:

 <div class="form-group">
  <label for="emailaddress">We are missing your email, please enter it below</label>
  <input type="text" name="emailaddress" id="emailaddress" placeholder="Enter your email" class="form-control">
  <div id="response" class="validation"></div>
</div>

Затем в ответе на ваш вызов ajax обновите содержимое и видимость #response элемента:

 if (data.indexOf("emailissue") > -1) 
{
  $("#response").show().text('Please Provide a valid email address');
  setTimeout(function(){
      $('#response').fadeOut();
  }, 3000);
}

Переключаясь между скрытием/отображением #response элемента, нам больше не нужно беспокоиться о добавлении дополнительных элементов ответа или удалении старых.

Вот ДЕМО, которое я сделал. Нажмите кнопку «Проверить» справа, чтобы увидеть его.

Ответ №2:

Почему у вас двойное»##», когда вы пытаетесь выбрать элемент?

Также через 3 секунды вам нужно удалить новый созданный div из DOM,

недостаточно просто вызвать fadeOut() (я думаю, это просто установить непрозрачность 0)

Метки: ,