导航时加载 GIF 图像

loading GIF image while navigating

本文关键字：图像 GIF 加载 导航      更新时间：2023-09-26

有什么方法可以在点击时加载 GIF 图像并同时进行导航。

我尝试使用 jQuery，但是在某些移动浏览器中页面导航时没有发生加载器动画，是否有使用 Ajax 的解决方案来克服这个问题？

最好的方法是使用 AJAX 加载新内容。您可以做的是有一个按钮，单击该按钮时会清除初始页面的html并重新加载其他html页面的内容。

假设您将页面的HTML内容放在一个名为 #div 的div中，并且有一个名为 #button 的按钮，单击该按钮会将您带到新页面。您现在可以做的是，无论何时单击 #button，您都可以清除当前div 的 HTML 内容，加载新页面的 HTML（加载时可以显示 GIF 图像），然后用新页面的 HTML 填充div。

$("#button").click(function() {
   //till the time the post function below doesn't return the following image will be displayed     
   $("#div").html('<img src = "images/ajax-loader.gif" />');
   $.post("get_html.php", function (data) {
    //get the new HTML content
    $("#div").html(data);
   });

});

这只是一个例子，如果你更具体地了解你需要什么，也许我可以写出适合你需求的代码。

相关文章：