2015-06-04 3 views
0

У меня есть форму отправки электронной почты, и когда пользователь отправляет, я хотел бы показать текст подтверждения ниже ввода. Через 5 секунд текст подтверждения снова исчезнет.Нажмите кнопку show div и скройте тот же div через 5 секунд

это мой код

<div class="input-group newsletter-group"> 
    <input type="text" class="form-control" id="email-to-submit"> 
    <div id="submit-email" class="input-group-addon">go!</div> 
</div> 
<div id="email-submit-form">THANKS!</div> 
<div id="invalid-email-warning" style="color: red; display: none;">Not an email address</div> 

$(function() { 
    setTimeout(function() { $("#email-submit-form").fadeOut(1500); }, 5000) 
     $('#submit-email').click(function() { 
      var emailAddress = $('#email-to-submit').val(); 
       if (validateEmail(emailAddress)){ 
        $('#email-to-submit').val(''); 
        $('#email-submit-form'); 
        $.ajax({ 
         type: "POST", 
         url: '/submitEmailAddress', 
         dataType: 'json', 
         data: JSON.stringify({'email': emailAddress}) 
        }); 
       } else { 
        $('#invalid-email-warning').show(); 
        } 
      $('#email-submit-form').show(); 
      setTimeout(function() { $("#email-submit-form").fadeOut(1500); }, 5000) 
    }) 
}); 
+0

Если ни один из ответов не помог, сообщите нам, возможно, объяснив вашу проблему более четко, чтобы мы могли снова поднести лоток – AmmarCSE

ответ

0

Вы можете использовать JQuery delay()

$('#email-submit-form').fadeIn().delay(5000).fadeOut(); 
+0

, почему downvote? – AmmarCSE

+0

это работает для меня, спасибо –

0

Попробуйте это ..

$('#email-submit-form').fadeIn('slow', function() { 
     $(this).delay(5000).fadeOut('slow'); 
     }); 
+0

Пожалуйста, объясните свой ответ. – Dropout

0

Напишите вашу логику ожидания в состоянии if(){ или AJAX success

$.ajax({ 
    type: "POST", 
    url: '/submitEmailAddress', 
    dataType: 'json', 
    data: JSON.stringify({ 
     'email': emailAddress 
    }), 
    success: function (response) { 
     $('#email-submit-form').show(); 
     setTimeout(function() { 
      $("#email-submit-form").fadeOut(1500); 
     }, 5000) 
    } 
}); 

Кроме того,

if (validateEmail(emailAddress)){ 
    $('#email-to-submit').val(''); 
    $('#email-submit-form'); //this line 

Третья строка не делает ничего, удалите его.

Смежные вопросы