单击对话框内的链接时如何关闭jquery ui对话框

Question

我已经做了一个条款和条件页面。 我想让它出现在jQuery对话框中。

我为对话框声明一个变量：

var $dialog = $('#TCsWindow').html('<iframe style="border: 0px;" src="importantInformation.html" width="100%" height="100%"></iframe>').hide();

然后创建一个函数以打开对话框：

    function opendialog(page) {
    $dialog.dialog({
        title: "",
        autoOpen: false,
        dialogClass: 'dialog_fixed TCdialog centered',
        modal: true,
        height: 500,
        width:400,
        responsive: true,
        draggable:true,
        open: function (event, ui) {
            $('#TCsWindow').css('overflow', 'hidden'); //this line does the actual hiding
            }
        });
    $dialog.dialog('open');
}

最后将click（）事件附加到页面上的元素：

    $("#TCLink").click(function(event) {
    event.preventDefault();
    opendialog("importantInformation.html");
});

我的问题是在重要信息.html页面中有一个链接，单击该链接只需要关闭对话框即可。 链接的ID为“ closeTC”：

    $("#closeTC").click(function(event){
    $dialog.close();
});

但是会发生的是，实际的包含页面会加载到iFrame中。 看来event.preventDefault（）; 被忽略。

谁能对我要去的地方有所了解？ 对话框上的默认关闭“ x”可以正常工作，但是我不知道如何找到它的工作方式。

Answer 1

该对话框位于父窗口中，而不位于iframe中，以便可以使用parent从iframe访问父窗口中的元素。

$(parent.document).find('#TCsWindow').dialog( "close" );

Answer 2

您需要使用event.stopPropagation()

Answer 3

您需要从父级调用jQuery .dialog("close")方法：

请参阅此答案以供参考。

编码

$(parent.document).find('#TCsWindow').dialog( "close" );