Question

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>

favsManageMemberLoginHistoryDialog模块：

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

0 个答案: