jQuery 通用代码

Question

我在应用程序中使用 jQuery 模式对话框来处理正常的 CRUD 操作。在某些情况下，我什至打开了两个堆叠模式对话框。

然后，我在外部 javascript 文件中创建了两个通用函数，分别处理 CRUD 表单的显示和提交。

为了显示模式对话框，我调用以下函数

function _loadDialog(level, action, id, title, onCloseHandler) {
    var panel = panels[level];
    $(panel).dialog("option", "title", title);
    var url = action;
    if (id != "") url = url + "/" + id;
    $.ajax({
        type: "get",
        dataType: "html",
        url: url,
        data: {},
        success: function(response) {
            $(panel).html('').html(response).dialog('open');
        }
    });
    $(panel).unbind("dialogclose").bind("dialogclose", function(event, ui) {
        if (onCloseHandler != null) {
            onCloseHandler();
        }
    });
}

此函数接收一个 level 参数，该参数指示函数如何堆叠对话框以及在哪里放置从 ajax 调用返回的渲染的部分标记。这个功能运行良好。

在ajax调用返回的部分 View 中有输入，最后有以下代码

<div style="text-align:right;">
    <input type="submit" id="btnSave" value="Salva" />
</div>

对于 jQuery 部分，例如，

$("#contactForm").submit(function(event) {
    _submitForm(1, event, "#contactForm", "post", "html", '<%= Url.Content("~/Contact/Save") %>');
});

如您所见，提交函数具有以下签名

function _submitForm(level, event, formName, atype, adataType, aurl) {
}

它的句柄

• 将表单提交给正确的 Controller 操作
• 用户反馈(例如“操作执行成功”)
• 对话框关闭操作

需要 level 参数来将所有功能(包括关闭对话框)寻址到所使用的正确 DIV 面板。

我希望能够有时将同一对话框显示为对话框，有时显示为子对话框。
为了能够做到这一点，我的意思是“从逻辑上讲”，因为我对 javascript 和 jQuery 不太熟悉，我需要进行以下更改:

• 修改 _loadDialog 函数以将 level 参数保存在对话框标记本身内
• 修改 _submitForm 函数，并使其使用之前从 _loadDialog 函数保存的正确 level 参数。

我怎样才能实现这个目标？

Answer 1

我对什么在何时何地有点困惑，但似乎您想将一些信息与特定元素相关联。

为此，您可以使用 jQuery 的 .data() 方法。它将把您想要的任何数据与特定元素关联起来。

不确定在您的情况下应该如何使用它，但这是一个通用示例:

$('#someSelector').data('level', 3);

现在，ID 为 someSelector 的元素会将数字 3 映射到其关联数据中的 'level' 属性。

因此要检索它，您可以这样做:

$('#someSelector').data('level'); // returns 3

当销毁具有关联数据的元素时(这只是此类数据的一个示例)，您应该确保使用 .remove() 或 .empty() 或自动或手动删除数据的其他方法之一。