Question

我在下面的代码中加载了test.php文件中的内容。 php文件中有很多代码，因此需要花费一些时间来加载。当它加载时，“加载内容”文本仍然存在。我希望能够： - 在页面加载时显示加载符号 - 内容出现后隐藏“加载内容”文本

我该怎么做？

    <script type="text/javascript">
          $(document).ready(function(){
            $("a").click(function(){
            $("#test").load('test.php');
          });
       });
    </script>

<div id="test"></div>
<a>Load content</a>

更新：

此外，我希望它是一个链接（因为它目前在触摸设备上不起作用） - 任何建议？

Answer 1

您可以将<a>标记嵌套在<div id="test">标记内，以便在.load()函数完成时将其删除，或添加代码以隐藏/删除<a>标记在AJAX调用的回调函数中：

<div id="test"><a>Load content</a></div>

或在您的JavaScript中

$("a").click(function(){
    /*Code to show loading message*/
    $("#test").load('test.php', function () {
        //this is a callback function that will fire after the data from test.php is loaded into the test div
        $('a').hide();//or you can use .remove() to completely remove the tag
        /*Code to remove the loading message*/
    });
});

Answer 2

将加载内容放在div中。完成后，负载将覆盖它。

Answer 3

请参阅the jQuery documentation for .load()。以下是您如何实现这一目标：

<script type="text/javascript">
    $(document).ready(function(){
        $("a").click(function(){
            // Display a loading message:
            $("#test").html('<p>Loading...</p>');

            // Load our data:
            $("#test").load('test.php', function() {
                // Code here runs when the load() completes:
                $("a").hide();
            });
        });
    }); </script>

<div id="test"></div> <a>Load content</a>

Answer 4

切换到$ .ajax（）。 $ .load和$ .get是主.ajax（）方法的辅助快捷方法，允许更多配置选项。

在beforeSend回调中设置加载器动画，并在onComplete回调中将其删除（无论拉动是成功还是错误，都会运行此回调）。您可能希望相应地在成功/错误回调中执行其他操作。

http://api.jquery.com/jQuery.ajax/

Answer 5

您需要在PHP脚本中使用“print”。

当我这样做时，我使用jquery ajax并在onSuccess

中显示响应

使用JQuery在PHP文件中加载内容

5 个答案: