Question

我有三个div，每个按钮用于触发我的对话框。当我触发父div时，它显示对话框和其他两个孩子的内容没有问题。

如果仅触发子div，它将打开并显示子div的内容ok，

但是当我打开[单击对话框的按钮]父div时，子div内容已经消失[通过firebug检查]或者没有显示，

但是当我触发子div的按钮时，对话框打开，内容没问题。

请帮助我，我错过了什么。感谢。

        <div id="parentDialog">
         <div id="childoneDialog"></div>
         <div id="childtwoDialog"></div>
        </div>
    <input id="buttonParent" type="button" />
    <input id="buttonChildone" type="button" />

$("#buttonParent").click( $("parentDialog").dialog.("open") .... );
$("#buttonChildone").click( $("childoneDialog").dialog.("open") .... );

Answer 1

这里的问题是您的对话框是嵌套的。 jQuery对话框的工作方式是假设所有对话框都必须是独占的。不要嵌套你的对话框，你应该没问题。

更新：根据您在下面的评论，您可以尝试以下操作。它并不完美但它应该能够胜任。例如：

<div id="Dialog1">
    <!-- dialog1 stuff here -->
    <div class="formTarget"><!-- dynamically insert form here --></div>
    <!-- more dialog1 stuff here -->
</div>

<div id="Dialog2">
    <!-- dialog2 stuff here -->
    <div class="formTarget"><!-- dynamically insert form here --></div>
    <!-- more dialog2 stuff here -->
</div>

<div id="reusableForm">
    <form><!--yourformhere--></form>
</div>

<script>
function triggerDialog(d) { // note that 'd' is the ID of the dialog you want to trigger
   $('#reusableForm').appendTo('#'+d+' .formTarget');
   $(''#'+d).dialog('open');
}
</script>

在您想要触发弹出窗口的任何链接或按钮上，执行以下操作：

<a href="#" onclick="triggerDialog('Dialog1')">Click here to trigger Dialog 1</a>
<button type="button" onclick="triggerDialog('Dialog2')">Click here to trigger Dialog 2</button>

本质上，此代码将表单移动到一个Dialog或另一个Dialog，具体取决于哪个表单被传递给triggerDialog函数。它并不完美，但它应该让你对jQuery和DOM操作的选项有所了解。您应该看到的其他一些jQuery方法是：

$.append()
$.clone()
$.after() / $.before()

查看http://api.jquery.com/以获取更多文档。

关闭</div>后，jquery ui对话框删除<div>

1 个答案: