javascript - Ajax 调用后的函数内的 document.ready()

Question

我有一个使用 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 结构中添加了新代码。在执行代码以附加所有事件处理程序之前，是否应该在 loadPage1Script() 中调用 $(document).ready(); ？如果我不这样做，会有什么不同吗？如果我添加 $(document).ready(); ，脚本启动速度会更快吗？

function loadPage1Script(){
    $(document).ready(function(){
        //Start the carousel plugin, for example
    });
}

取自 jQuery 站点 ( http://api.jquery.com/ready/ ):

"In most cases, the script can be run as soon as the DOM hierarchy has been fully constructed. The handler passed to .ready() is guaranteed to be executed after the DOM is ready, so this is usually the best place to attach all other event handlers and run other jQuery code."

Answer 1

如果您在调用后调用 loadpage 函数

$( document ).ready( function () {
    ...
});

那就应该没关系了。此外，由于 $.fn.html 函数不是异步的，因此立即运行 loadPageScript 函数不会有任何问题