如何在使用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;
}