1

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

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

旧代码（作品）：

$('#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);

我没有看到任何错误触发。我看到控制台打印出“完成”，但时间似乎不同。在调用 when/load/then 之前存在于页面上的图例应用了 click 事件，但从 OrderDetails 返回的视图中加载的图例没有绑定到它们的 click 事件。

相比之下，旧代码的成功函数将点击事件适当地应用于所有图例。为什么会这样？

4

1 回答 1

1

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

就像是：

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

于 2012-09-25T19:12:22.607 回答