我有一个页面加载的旋转动画 .gif 文件,当页面在提交表单后正在加载时出现,一切正常。然而,如果您提交表单,然后在浏览器中点击返回箭头,它会显示以前的页面,并显示加载中的 .gif 动画。
我设置了加载 gif 在页面加载时隐藏。但是,如果您只是在浏览器中点击返回按钮(例如 Firefox),它不会完全重新加载页面,动画 gif 仍然可见。
是否有办法在浏览器返回按钮被点击时隐藏加载的 .gif?
这是我的 jQuery 代码:
<!-- inline scripts related to this page -->
<script type="text/javascript">
// Show spinning animation on form submit.
$("#filter-results-form").submit(function (e) {
// Check for form errors before displaying loading gif.
if ($('.field-validation-error').length > 1) {
$("#loading-image").hide();
} else {
$("#loading-image").show(0); // show animation
}
return true; // allow regular form submission
});
</script>
这是我的相关HTML代码:
<div>
<button type="submit"><i class="fa fa-search"></i> Search</button>
<span class="loading collapse" id="loading-image"><img src="@Url.Content("~/content/img/layout/ajax-loader.gif")"></span>
</div>
我曾尝试将此作为解决方法,但它并没有奏效:
jQuery(function ($) {
$("#loading-image").hide(); // Hide animation on page load.
});