等待使用jQuery加载模型的数据时-体验时间差异？

Question

我有一个MVC应用程序。我试图使用jQuery的load从服务器加载一个模型。这个很好用。在加载了所有视图之后，我现在正在尝试运行一些JavaScript。因此，我将通过使用jQuery .when介绍jQuery的延迟承诺功能。

我对这个功能的理解有限，这使我相信下面的两段代码应该运行相同。不过，在我看来，我的“当时”方法执行得太快了。我不知道该怎么确认。

旧代码(作品)：

$('#OrderDetails').load('../../csweb/Orders/OrderDetails', function () {
    $("fieldset legend").off('click').click(function () {
        var fieldset = $(this).parent();
        var isWrappedInDiv = $(fieldset.children()[0]).is('div');

        if (isWrappedInDiv) {
            fieldset.find("div").slideToggle();
        } else {
            fieldset.wrapInner("<div>");
            $(this).appendTo($(this).parent().parent());
            fieldset.find("div").slideToggle();
        }
    });
});

现在，我想将其扩展到等待多个加载事件。不过，为了保持简单，我只想试着等待OrderDetails：

新代码(不起作用)：

var onDisplayLoadSuccess = function () {
    console.log("Done!");
    console.log('Fieldset legend:', $('fieldset legend'); //Not all found.
    $("fieldset legend").off('click').click(function () {
        var fieldset = $(this).parent();
        var isWrappedInDiv = $(fieldset.children()[0]).is('div');

        if (isWrappedInDiv) {
            fieldset.find("div").slideToggle();
        } else {
            fieldset.wrapInner("<div>");
            $(this).appendTo($(this).parent().parent());
            fieldset.find("div").slideToggle();
        }
    });
};

var onDisplayLoadFailure = function () {console.error("Error.");};

$.when($('#OrderDetails').load('../../csweb/Orders/OrderDetails')).then(onDisplayLoadSuccess, onDisplayLoadFailure);

我没有看到任何错误。我看到控制台打印的“完成”，但时间似乎不同。在调用/load/然后将单击事件应用于它们之前，页面上存在的图例，但是在OrderDetails 提供的视图中加载的图例不将单击事件绑定到它们。

相反，旧代码的成功函数适当地将单击事件应用于所有传说。为什么会是这样呢？

Answer 1

要捕获绑定事件后动态添加的DOM元素上的事件，需要委托它(http://api.jquery.com/on/)。

类似于：

$('fieldset').on('click', 'legend', function(){