我正在开发一个可以在计算机以及 Ipad、Iphone、平板电脑和 Android 手机上运行的应用程序。我有一个要求,即当用户从一个页面移动到另一页面时显示正在加载...gif,因为这将为用户提供页面加载/卸载正在进行的信息。
所以我尝试了下面提到的代码
///下面的代码用于在 DOM 未准备好时显示 GIF。
$(document).ready(function(){
$("#loading").hide();});
//下面的代码用于当用户单击某个按钮进行某些服务器交互时显示 GIF。
$(window).bind('beforeunload',function(){
$("#loading").show();});
其中 #loading 是包含我的 GIF 代码的 div 的 id。
现在,这在 PC 浏览器上运行良好,但不适用于 Ipad、Iphone 和 Android 手机。我不明白为什么。
<div id="loading">
<img id="loading-image" src="/img/loading.gif" alt="Loading..." /></div>
该 div 用于加载 GIF。
我使用“window.onbeforeunload”事件和 jquery-loading-overlay
link:
https://gasparesganga.com/labs/jquery-loading-overlay/ https://gasparesganga.com/labs/jquery-loading-overlay/
完整的代码在这里
<!-- also link to jquery.js -->
<script src="https://cdn.jsdelivr.net/npm/[email protected] /cdn-cgi/l/email-protection/dist/loadingoverlay.min.js"></script>
<script>
window.onbeforeunload = function () {
// Show Loding
$.LoadingOverlay("show");
// Disable javascript default confirm message
//return "Are you sure you wish to leave the page?";
return undefined;
};
// If Canceled by user
$(document).keyup(function (e) {
if (e.key === "Escape") {
$.LoadingOverlay("hide");
}
});
</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)