Javascript 如何使用JQuery UI创建表单对话框？

这可能看起来很明显，但我整晚都在研究这个问题，但毫无结果。我喜欢JQuery，但我不能掌握JQuery UI。也许我错过了一些基本的东西。我试图在屏幕上弹出一个包含表单的框，当我单击Submit时，我需要做一些Ajax魔术来将用户输入提交到数据库中。这一切都很好，但实际上让盒子出现是另一回事。我看了几十本教程，它讨厌我。基本上，这就是细分：

我的网站（在Linux上开发）有一个绝对根路径/mysite

我在/mysite/includes/JQuery.js和/mysite/includes/JQuery UI/…中保存JQuery和JQuery UI（以及其他内容）。。。其中“…”是所有JQuery UI源文件

页面的主体部分有点复杂。基本上，所有内容都是通过一个标签系统进行交换的，我在一个名为“content”的div中使用Ajax制作了这个标签系统。这个div包含一个可点击的链接，我需要按下它来弹出一个对话框输入表单，如jqueryui示例站点所示

我尝试了以下几种方法。。。以下所有代码都在“contents”div元素中：

    <link rel="stylesheet" href="/mysite/includes/jquery-ui/themes/base/ui.all.css" type="text/css">
    <script src="/mysite/includes/jquery-ui/jquery-1.6.2.js"></script>
    <script src="/mysite/includes/jquery-ui/ui/ui.draggable.js"></script>
    <script src="/mysite/includes/jquery-ui/ui/ui.resizable.js"></script>
    <script src="/mysite/includes/jquery-ui/ui/ui.core.js"></script>
    <script src="/mysite/includes/jquery-ui/ui/ui.dialog.js"></script>
    <script src="/mysite/includes/jquery-ui/external/jquery.bgiframe-2.1.2.js"></script>
    <link type="text/css" href="/mysite/includes/jquery-ui/demos/demos.css" rel="stylesheet" />

在这一点上，我已经尝试了几乎所有的例子来获得我在网上找到的弹出窗口，但没有一个成功。我怎样才能把它打开呢？所有jQueryUI脚本都必须包含在“head”标记中吗？或者我必须告诉JQuery引用主窗口而不是“contents”元素吗

---

任何帮助都将不胜感激。谢谢

文档通常是一个很好的开始…然后可能会阅读DOM（“表单”）在DOM中的情况，顺便说一下，您有太多的http请求，在实时模式下压缩它们，html5bolierplate构建是一个很好的开始

我知道这不是一个jQuery对话框，但它不会太臃肿：

如果您希望在提交表单后弹出，只需将此代码添加到

$（document）.ready（）中即可：

希望这能帮助您，或者至少有人在寻找jQuery UI对话框更轻量级的解决方案。
您尝试过吗？另外，在JS文件之前包含CSS文件。这是我的目标，让它发挥作用。不知何故，即使复制粘贴源代码也不适合我。我猜我的网站的结构使用了加载的内容HTML页面，这会把一切都搞砸。此外，我没有为jQueryu调用那么多js文件，而是下载了一个组合js文件，其中包含了您需要的所有功能的代码
    $("#form").submit(function(){
        $("#modal-background, #modal-content").toggleClass("active");
        $.ajax({
            type: "POST",
            url: "http://www.example.com/form.php",
            data: {name: "John Smith", address: "3 Tree Street"},
            success: function(data){},
            dataType: "json"});
        return false;
    });