导航时加载GIF图像

Question

是否可以在onclick上同时加载GIF图像，导航应该发生。

我尝试使用jquery但是在某些移动浏览器中页面导航时没有发生加载器动画，是否有使用ajax解决该问题的解决方案？

Answer 1

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

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

$("#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);

   });


});

这只是一个例子，如果您对所需内容更具体，也许我可以编写适合您需求的代码。