Как затухать сообщение об успешном завершении после перезагрузки страницы с помощью jQuery?

Question

Я много раз искал эту тему и получал много разных ответов, однако ни один из них не работает для меня.

У меня есть форма, когда она успешно отправляется, перезагружает страницу.

$('form').on('submit', function(event){ 
if($('#input').val() == 0){ 
    alert("Please insert your name"); 
    event.preventDefault(); 
    } 
} 

Теперь на каждый успешный отправить Хочу сообщение об успешном скользить в верхней части, оставаться там в течение 2 секунд, а затем постепенно исчезают.

Я пробовал это, однако, он не остается после перезагрузки страницы.

else{ 
    $('.success_message').fadeIn(1500); 
    } 

Возможно ли это в чистом jQuery?

Кроме того, я не ищу способ перезагрузки страницы. Страница автоматически перезагружается после отправки формы.

Answer 1

После заполнения формы, установите значение в localStorage, указывающее, что сообщение об успешном должно исчезнуть в:

$('form').on('submit', function(event) { 
    if ($('#input').val() == 0){ 
    alert("Please insert your name"); 
    event.preventDefault(); 
    } 
    localStorage.fadeInSuccessMessage = "1" 
}); 

Затем проверьте, существует ли значение в localStorage. Если да, то исчезают в сообщении и удалить значение из localStorage:

if ("fadeInSuccessMessage" in localStorage) { 
    $('.success_message').fadeIn(1500); 
    delete localStorage.fadeInSuccessMessage; 
}