我有一个加载旋转动画.gif,在页面提交后,页面加载后出现,一切正常.但是,如果您提交表单,然后单击浏览器上的后退箭头,它将显示上一页,加载.gif仍然可见.
我设置它,以便在页面加载时隐藏加载gif.但是,如果您只是单击浏览器中的后退按钮(如firefox),它就无法完全重新加载页面,动画gif仍然可见.
有没有办法在点击浏览器后退按钮时隐藏加载.gif文件?
<!-- 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. });
解决方法
我发现这个工作,而不必禁用缓存.事实证明,有一个pageshow事件,即使从缓存加载页面,您也可以执行操作.
$(window).bind("pageshow",function(event) { $("#loading-image").hide(); });