在AJAX注入内容中使用jQuery

tl；dr:将内容加载到DOM后，jQuery最早访问添加元素的时间是多少

---

我正在重构我现有的JavaScript。目前，我有一些模块可以将内容加载到对话框中，在加载对话框后的回调中，负责将事件附加到对话框上的元素

我不喜欢加载对话框的模块知道加载的对话框元素的细节。相反，我现在采用的方法是，加载对话框的模块只需执行此操作

现在，附加事件的责任落在对话框本身上。我这样做的方法是，在加载到对话框中的内容的标记中嵌入一个JavaScript文件，然后调用一个init方法来绑定事件

我现在面临的问题是，出于某种原因，在init方法中，jQuery找不到脚本要查找的元素。几乎就像它们还没有被加载到DOM中一样

如果在加载对话框后，我从控制台手动查找元素，则效果良好

我的问题是，在进行AJAX调用时，jQuery在什么时候可以访问新添加的元素

您认为我在对话框标记中嵌入JavaScript的方法如何？ 我总是可以有一个回调，加载对话框的模块可以使用它来初始化事件，但我正在尝试封装对话框中的逻辑，以便可以从多个位置加载对话框，而不必重复启动代码

是否有更好的方法来附加事件，在内容添加到DOM后执行逻辑

加载对话框：

loadMemberLoginHistoryDialog: function(memberId) {
    var dialogOptions = {
        onComplete: function(responseHtml) {}
    };
    var dialogUrl = '/members/' + memberId + '/loginHistoryDialog';
    $.favsDialog(dialogUrl, dialogOptions);
}

        <script src="/js/zMemberLoginHistoryDialog.js" type="text/javascript"></script>
        <script>
            favsManageMemberLoginHistoryDialog.init('@Constants.LanguageCode');
        </script>

var favsManageMemberLoginHistoryDialog = function() {
   function initializeControls() {
        $(".frmManageMembersMemberDelete")
            .submit(function() {
            if (confirm("Are you sure?")) {
                return true;
            }
            return false;
        });
    }

    return {
        init: function(language) {
            languageCode = language;
            initializeControls();
        }
    }; //return
}

对话框中加载的内容标记中的脚本：

loadMemberLoginHistoryDialog: function(memberId) {
    var dialogOptions = {
        onComplete: function(responseHtml) {}
    };
    var dialogUrl = '/members/' + memberId + '/loginHistoryDialog';
    $.favsDialog(dialogUrl, dialogOptions);
}

        <script src="/js/zMemberLoginHistoryDialog.js" type="text/javascript"></script>
        <script>
            favsManageMemberLoginHistoryDialog.init('@Constants.LanguageCode');
        </script>

var favsManageMemberLoginHistoryDialog = function() {
   function initializeControls() {
        $(".frmManageMembersMemberDelete")
            .submit(function() {
            if (confirm("Are you sure?")) {
                return true;
            }
            return false;
        });
    }

    return {
        init: function(language) {
            languageCode = language;
            initializeControls();
        }
    }; //return
}

---

你能给我们一些代码作为你具体在做什么的例子吗？我已经添加了一个代码示例来研究这个问题：“当进行AJAX调用时，jQuery在什么时候可以访问新添加的元素？”-一旦元素实际添加，jQuery（更广泛地说，是JavaScript）就可以立即访问。但是，如果是一个异步添加的Ajax调用，那么在调用完成之前，元素不会出现，因此您应该只尝试从Ajax请求的success/complete回调中访问这些元素。