JQuery UI对话框。('close');不工作

时间:2021-10-04 19:40:54

I have a page with multiple modal jQuery UI dialogs, I am trying to make a link on one dialog (faq) that will close that dialog and open another one (warranty). Below is the relevant code:

我有一个包含多个模态jQuery UI对话框的页面,我试图在一个对话框(faq)上建立一个链接,该对话框将关闭该对话框并打开另一个对话框(保修)。以下是相关代码:

var $faqIframe = $('<iframe />', {
                name: 'myFrame',
                id:   'myFrame',
                src: "modal_faq.html",
                width:"100%",
                height:"100%",
                align:"left",
                scrolling:"auto",
                frameborder:"0"
            }); 

var $warrantiesIframe = $('<iframe />', {
                name: 'myFrame1',
                id:   'myFrame1',
                src: "modal_warranties.html",
                width:"100%",
                height:"100%",
                align:"left",
                scrolling:"auto",
                frameborder:"0"
            });

and then, to open the faq iFrame

然后,打开faq iFrame

$(function(){
    $('#faqDialog').dialog({
        autoOpen: false,
        width: 780,
        height: 460,
        modal: true
    });

    $('#faqDialog').append($faqIframe.clone());

    // Dialog Link
    $('#faq_link, #faq_link1').click(function(){
        $('#faqDialog').dialog('open');


        return false;
    });

This works fine, opens the dialog as expected. I have similar code for the warranty dialog as well. This is the code that is currently not working. #warranty_link2 is a link on the faq dialog that, when clicked, I would like to trigger the closing of the faq dialog.

这工作正常,按预期打开对话框。我也有类似的保修对话框代码。这是当前无法正常工作的代码。 #warranty_link2是常见问题对话框上的一个链接,单击此按钮时,我想触发关闭常见问题对话框。

    $('#warranty_link2').on("click", function(event){
        $('#faqDialog').dialog('close');
    });
}

I have tried

我努力了

$('#faqDialog').dialog('close');
$('#faqDialog').dialog('hide');
$('#faqDialog').dialog('destroy');

I have also tried with 'live' instead of 'on', and without either of those two as well Also tried referencing it with the var $faqIframe, as in

我也试过'live'而不是'on',并且没有这两个中的任何一个也尝试用var $ faqIframe引用它,如

$faqIframe.dialog('close') 

with no results.

没有结果。

I know the click event is firing because I put in a console.log which worked.

我知道click事件正在触发,因为我放入了一个有效的console.log。

What am I doing wrong and how can I get this dialog to close?

我做错了什么,怎么才能关闭这个对话框?

See it in action at http://www.solarkit2go.com - click the faq link

请访问http://www.solarkit2go.com查看其中的操作 - 单击常见问题链接

1 个解决方案

#1


2  

You have to bind the onclick event after you fire the dialog. See below

触发对话框后,必须绑定onclick事件。见下文

$(function(){
   $('#faqDialog').dialog({
    autoOpen: false,
    width: 780,
    height: 460,
    modal: true
});

$('#faqDialog').append($faqIframe.clone());

// Dialog Link
$('#faq_link, #faq_link1').click(function(){
    $('#faqDialog').dialog('open');

    $('#warranty_link2').click(function(event){
        $('#faqDialog').dialog('close');
    });

    return false;
});

#1


2  

You have to bind the onclick event after you fire the dialog. See below

触发对话框后,必须绑定onclick事件。见下文

$(function(){
   $('#faqDialog').dialog({
    autoOpen: false,
    width: 780,
    height: 460,
    modal: true
});

$('#faqDialog').append($faqIframe.clone());

// Dialog Link
$('#faq_link, #faq_link1').click(function(){
    $('#faqDialog').dialog('open');

    $('#warranty_link2').click(function(event){
        $('#faqDialog').dialog('close');
    });

    return false;
});