jQueryUI对话框窗口故障

以下是jQuery代码：

<script>
    $(document).ready(function() {

        $('.class112').click(function() {
           var msg = $(this).attr('id');
           $('#'+msg).dialog({
                autoOpen:false,
                width:100,
                height:200,
                position:[250,50]
           });

           $('#'+msg).load('classSource/'+msg+'.html');
           $('#'+msg).dialog('open');
       });
   });
</script>

$（文档）.ready（函数（）{
$（'.class112'）。单击（函数（）{
var msg=$（this.attr（'id'）；
$（'#'+msg）.对话框({
自动打开：错误，
宽度：100，
身高：200，
职位：[250,50]
});
$（'#'+msg）.load（'classSource/'+msg+'.html'）；
$（'#'+msg）.dialog（'open'）；
});
});

和HTML代码：

<p class="class112" id="class1">open it dude! </p>

<p class="class112" id="class2">open2 dude!</p>

打开它，伙计

open2都德

---

我的目的是每当用户单击上面提到的段落之一时，就会出现一个jQuery用户界面对话框窗口，其中加载了相关的HTML文件。它工作得很好，但我的想法是，当我点击段落时，它们会在点击后消失。我哪里做错了？

您正在将您的段落转换为对话框：

$('#'+msg).dialog({
    // ...
});

一旦您这样做，jQuery UI将隐藏您的段落，直到您打开以下对话框：

$('#'+msg').dialog('open');

然后，当您关闭对话框时，它将再次隐藏

您可能需要为对话框指定一个专用元素。为对话框创建HTML元素并将其隐藏：

<div id="dialog" style="display: none;"></div>

请注意，我还将

.dialog（'open'）

调用移动到了回调中，这样在加载适当的内容之前对话框不会打开；您可能还需要添加一些类似于GIF的动画“加载”

---

如果您希望同时打开多个对话框，那么您必须稍微调整上述内容，添加一个单独的

，其中

X

是段落

id

，这将是一种非常简单的安排方式。

所以您基本上说，我不允许仅从一个div生成多个对话框，在HTML中创建的对话框窗口和div的数量应该相等，对吗？您能告诉我如何可以同时打开多个对话框吗？@buri:您可以在构建页面时创建额外的

s（每个段落一个），或者检查您想要的对话框是否存在（

$（“#”+msg+'-dialog'）。长度>0

）如果不存在（

$（“”）.dialog（{…}）.appendTo（'body'）

），则创建它。

$('#dialog').dialog({
    autoOpen: false,
    width: 100,
    height: 200,
    position: [250,50]
});

$('.class112').click(function() { 
    var msg = $(this).attr('id');
    $('#dialog').load('classSource/' + msg + '.html', function() {
        $('#dialog').dialog('open');
    });
});