无法关闭模态弹出窗口

Question

我在弹出窗口中查看开场，如下所示。

 $(function () {
        $('#lnkPremiumAllocationPlan').click(function () {
            var selPolicyId = $('#sltPolicyName option:selected').val();
            $.ajax({              

                url: '@Url.Action("GetPolicyPremiumAllocation", "Policy")',

                data: { policyID: selPolicyId },

                type: 'POST',
                success: function (data) {
                    if (data.length >0) {                       

                        $("#modal_dialog").load(data);
                        $("#modal_dialog").dialog("open");
                    }                 
            }

            });
        });

        $("#modal_dialog").dialog({
            autoOpen: false,
            height: 600, width: 'auto',
            title: "Premium Allocation",
            buttons: {
                Cancel: function () {                   
                    $(this).dialog("close");                 

                }
            },
            modal: true
        });
    })
</script>

当我点击弹出窗口的“取消”按钮时，它不会关闭。

我也包含了以下文件。

<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery-ui-1.8.20.min.js"></script>
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />

无法弄清楚我做错了什么。请帮忙。

Answer 1

使用$（“＃modal_dialog”）而不是$（this）。这仅指当前对象。

$("#modal_dialog").dialog({
   autoOpen: false,
    height: 600, width: 'auto',
    title: "Premium Allocation",
    buttons: {
        Cancel: function () {                   
            $("#modal_dialog").dialog("close"); 
        }
    },
    modal: true
});