Jquery加载图像 - 在Web浏览器中处理Back/Forward按钮

我使用以下方法在加载页面时显示加载图像以通知用户加载操作正在进行中。如果我在网页浏览器中按下“后退”按钮，有时页面会从加载图像开始，页面被删除。我想确保如果用户在网络浏览器中按下后退/前进按钮，则需要显示加载图像。Jquery加载图像 - 在Web浏览器中处理Back/Forward按钮

正在使用的方法。

的Javascript：

<script language="javascript" type="text/javascript"> 
$(document).ready(function(){ 
    //This line below would hide the div when the page load by default 
    $('#loading').hide(); 

    //This would display when the user clicks the button 
    $('#buttonID').click(function(){ 
    if($('#search_string').val().length !== 0) {  
    $('#loading').show(); 
    } 
    }); 
    $('a.la').click(function(){ 
    $('#loading').show(); 
}); 
}); 
$(window).load(function() { 
$('#loading').hide(); 
}); 
</script>

的CSS

#loading { 
    width: 100%; 
    height: 100%; 
    top: 0; 
    left: 0; 
    position: fixed; 
    display: block; 

    z-index: 99; 
    text-align: center; 
} 

#loading-image { 
    position: absolute; 
    top: 160px; 
    left: 130px; 
    z-index: 100; 
}

HTML

<button id='buttonID' type="submit"></button> 
<a class="la" href="search.php">Some text</a><br>

来源

2016-11-07 chejnik

您可以尝试添加''到''而不是在document.ready – mplungjan

这似乎工作。我将在处理页面时测试它。谢谢！ – chejnik

这是更好地听取浏览器和写入以这种方式使这些东西变得无关紧要您的应用程序。

而且，这也是事实，浏览器锁定的东西越来越多客户端的JavaScript应用，因此它极有可能您的应用程序会后失败的（少数）浏览器升级

这很好说明如下：HTML 5 History Spec 并展示这里：History Demo

来源

2016-11-07 13:51:23

Jquery加载图像 - 在Web浏览器中处理Back/Forward按钮

回答

相关问题