当前位置:  开发笔记 > 编程语言 > 正文

jQuery对话框

如何解决《jQuery对话框》经验,为你挑选了3个好方法。

我试图用jquery做一个对话框.在这个对话框中我将有条款和条件.问题是该对话框仅显示第一次.

这是代码.

JavaScript的:

function showTOC()
{
    $("#TOC").dialog({ 
        modal: true, 
        overlay: { 
            opacity: 0.7, 
            background: "black" 
        } 
    })
}

HTML(a href):

View Terms & Conditions

1..2..

我认为问题是当你关闭对话框时,DIV会从html代码中被销毁,因此它永远不会再次显示在屏幕上.

你能帮忙吗?

谢谢



1> RaeLehman..:

我遇到了同样的问题(对话框只打开一次,关闭后,它不会再次打开),并尝试上面的解决方案,但没有解决我的问题.我回到文档,意识到我对对话框的工作原理有一个根本的误解.

$('#myDiv').dialog()命令创建/实例化对话框,但不一定是打开它的正确方法.打开它的正确方法是使用dialog()实例化对话框,然后使用对话框('open')显示它,并使用对话框('close')来关闭/隐藏它.这意味着您可能希望将autoOpen选项设置为false.

因此,过程是:在文档准备就绪时实例化对话框,然后监听单击或要显示对话框的任何操作.然后它会一次又一次地工作!







I am a modal dialog



2> carlsz..:

看起来您发布的代码存在问题.显示T&C的功能是引用了错误的div id.在加载文档后,您应该考虑将showTOC函数分配给onclick属性:

$(document).ready({
    $('a.TOClink').click(function(){
        showTOC();
    });
});

function showTOC() {
    $('#example').dialog({modal:true});
}

使用jQuery UI对话框实现所需效果的更简洁示例是:

   
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Show Terms & Conditions



3> Rickster..:

我有同样的问题,并正在寻找一种方法来解决它,这让我来到这里.在回顾了RaeLehman提出的建议后,它引导我找到了解决方案.这是我的实施.

在我的$(document).ready事件中,我将autoOpen设置为false来初始化对话框.我还选择将click事件绑定到一个元素,比如一个按钮,它将打开我的对话框.

$(document).ready(function(){

    // Initialize my dialog
    $("#dialog").dialog({
        autoOpen: false,
        modal: true,
        buttons: {
        "OK":function() { // do something },
        "Cancel": function() { $(this).dialog("close"); }
    }
    });

    // Bind to the click event for my button and execute my function
    $("#x-button").click(function(){
        Foo.DoSomething();
    });
});

接下来,我确保定义了函数,这是我实现对话框打开方法的地方.

var Foo = {
    DoSomething: function(){
        $("#dialog").dialog("open");
    }
}

顺便说一下,我在IE7和Firefox中测试了它,它运行正常.希望这可以帮助!

推荐阅读
wangtao
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有