Question

我有一个MVC应用程序。我试图使用jQuery的加载从服务器加载模型。这完全没问题。我现在正在尝试在加载所有视图后运行一些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 /之后存在于页面上的图例然后将click事件应用于它们，但是在OrderDetails 返回的视图中加载的图例不将click事件绑定到它们。

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

Answer 1

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

类似的东西：

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

在遇到时序差异时，等待使用jQuery加载模型的数据？

1 个答案: