jQuery ("#dialog").dialog('close') 不能使用单独视图上的按钮答案

【问题标题】：jQuery ("#dialog").dialog('close') not working with button on separate viewjQuery ("#dialog").dialog('close') 不能使用单独视图上的按钮
【发布时间】：2015-06-22 01:49:27
【问题描述】：

我在一个 MVC 项目中有一个 ASP.NET 视图，我试图在其中创建一个弹出对话框来创建数据。还有另一个视图被加载，该视图有一个 ID 为“btncancel_create”的按钮。我无法获得该按钮来关闭对话框。我正在使用 jQuery 2.1.3 和 jQuery UI 1.11.4。

这里是按钮的代码：

<input type="button" value="Cancel" id="btncancel_create" />

这是视图：

$(document).ready(function () {
    //alert("Document is ready");
    var url = "";

    $("#dialog-create").dialog({
        title: 'Create User',
        autoOpen: false,
        resizable: false,
        width: 400,
        show: { effect: 'drop', direction: "up" },
        modal: true,
        draggable: true,
        open: function (event, ui) {
            $(".ui-dialog-titlebar-close").hide();
            $(this).load(url);
        }
    });

    $("#lnkCreate").on("click", function (e) {
        url = $(this).attr('href');
        $("#dialog-create").dialog('open');

        return false;
    });

    //$("#btncancel_create").on("click", function (e) {
    //    $("#dialog-create").dialog("close");
    //    return false;
    //});

    $("#dialog-create").button("#btncancel_create").click(function (e) {
        alert("btncancel_create was clicked");
        $("#dialog-create").dialog('close');
        return false;
    });
});

<div id="dialog-create" style="display: none"></div>

<p>@Html.ActionLink("Create New", "Create", null, new { id = "lnkCreate" })</p>

如您所见，我尝试了其他不起作用的方法，已被注释掉。未注释的按钮单击功能会返回警报，但不会关闭对话框。提前感谢您的帮助，如果您需要更多信息，请告诉我。

【问题讨论】：

我正在测试您的代码是否正确。可能是错误的选择器。测试 console.log($("#dialog-create"))
你能试试 $.modal.close(); 吗？
这两件事都不起作用。 Console.log 显示该按钮已被单击。但是，我发现不是单击的按钮而是整个对话框，所以这是错误的。找到的原始代码是： $("#btncancel_create").live("click", function (e) { $("#dialog-create").dialog("close"); return false; });但是“.live”现在已被弃用，所以我尝试了“.on”，但这根本不起作用。

标签： javascript jquery asp.net jquery-ui

【解决方案1】：

代替
$("#btncancel_create").on("click", function (e) {...
（在我上面注释掉的代码中）
应该是
$(document).on("click", "#btncancel_create", function (e) {...。

我在这里找到了答案：Turning live() into on() in jQuery。

【讨论】：