Question

我正在开发一个单页的网页应用。我做的是我有一个主页面index.html，我有应用程序的所有骨架，但我在body一个div，我用来加载页面的内容我要表现出来。在加载的页面中，我有一个div，其内容也需要加载。问题是第二个div的内容没有出现，我无法弄清楚原因。

我认为你需要一个例子来更好地理解。

我有两个html文件：index.html和browse.html。

首先是browse.html：

<div id="browse_contents">
</div>

最后这里是index.html：

<html>
<head>
//load jquery

<script>

$(document).ready(function(){

$("#browse_page").load("browse.html")
$("#browse_contents").html("<p>The contents.</p>")

});
</script>
</head>

<body>
<div id="browse_page"></div>
</body>
</html

问题在于＆＃34;内容。＆＃34;没有出现，我无法弄清楚原因！

Answer 1

目前，当您尝试更改其HTML时，DOM中不存在#browse_contents。

.load()是异步的，这就是它和其他jQuery AJAX方法带有回调参数的原因;请求完成时调用的函数：

$(document).ready(function(){
    $("#browse_page").load("browse.html", function(){
        $("#browse_contents").html("<p>The contents.</p>");
    });
});

加载的div的内容不会从加载的HTML中显示

1 个答案: