Question

请帮我弄清楚我错过了什么。

这是我的html，名为“test.html”

<div id="div-test">
lalalalaal
    <ul>
        <li>Hi</li>
        <li>By</li>
    </ul>
</div>

这是同一目录中的另一个html文件，其中包含：

<div id="result"></div>
<script type="text/javascript">
$(function() {
    $("#result").load("test.html");
});
</script>

但它没有加载任何东西。

然而，这很好用：

<div id="result"></div>
<script type="text/javascript">
$(function() {
    $("#result").html("i see this text");
});
</script>

Answer 1

当我需要定期加载数据时，我只需要创建一个动态加载的函数，这样我就可以在需要时调用它，或者在页面加载时加载

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
        <script>
            function loadContent(divName,pageURL) {
                $("#" + divName).load(pageURL);
            }
            $(document).ready(function() {
                loadContent('createArea','create_login.php');
            });
        </script>
    </head>
    <body>
        <div style="float:left;width:500px;min-width:500px;min-height:200px;">
            <div id="createArea" name="createArea"></div>
        </div>
    </body>
</html>

如下所述，除非您正在运行WAMP服务器，否则不会在本地执行此操作。如果它们没有与具有此代码的页面驻留在同一目录中，则您加载的文件的路径可能需要是相对的。

Answer 2

如果您使用Chrome或IE9，请尝试监控XHR网络呼叫以查看内容真的发生了。在Chrome上，您可以通过

监控XHR呼叫

点击F12
点击网络按钮
单击控制台底部的XHR标签。
打开控制台，执行代码不起作用的页面，检查是否有实际的数据交换。

希望有所帮助

Answer 3

试试这个：

<div id="result"></div>
<script type="text/javascript">
$(function() {
    $("#result").load("/test.html"); // add "/"
});
</script>

JQuery .load（）不加载html

3 个答案: