我有一个使用ajax调用来加载内容的应用程序。那些ajax调用只检索HTML。 Javascript在另一个文件中。
在进行AJAX调用之后,我将调用一个应该尽快开始执行javascript的函数。
这里我留下一个小函数,它将从ajax调用中检索一些代码。
function loadPage(page) {
$(".container").html("");
if(page == "page1") {
$.ajax({
url: "/page1.php",
success: function(html){
$(".container").html(html);
loadPage1Script();
}
});
}else if(page == "page2"){
$.ajax({
url: "/page2.php",
success: function(html){
$(".container").html(html);
loadPage2Script();
}
});
}
}
之后,他们将执行loadPage1Script()或loadPage2Script()。
function loadPage1Script(){
//Start the carousel plugin, for example
}
HTML结构中添加了一个新代码。我应该拨打$(document).ready();在执行代码之前在loadPage1Script()中附加所有事件处理程序?如果我不这样做,有什么不同吗?如果我添加$(document).ready();脚本会更快地启动吗? ?
function loadPage1Script(){
$(document).ready(function(){
//Start the carousel plugin, for example
});
}
取自jquery网站(http://api.jquery.com/ready/):
“在大多数情况下,只要DOM层次结构完全构建就可以运行脚本。传递给.ready()的处理程序保证在DOM准备好后执行,所以这通常是附加所有其他事件处理程序并运行其他jQuery代码的最佳位置。“
答案 0 :(得分:1)
如果在调用
之后调用loadpage
函数
$( document ).ready( function () {
...
});
那应该没关系。此外,由于$.fn.html
功能不是异步的,因此您可以立即运行loadPageScript
功能
答案 1 :(得分:1)
没有必要在这些函数中使用$(document).ready()
,因为在运行DOM元素时,他们需要的元素已经存在(您只需在调用函数之前将它们插入到页面中)。
但是,您应该调用loadPage
内的原始$(document).ready()
函数,以确保.container
元素存在。