Question

因此，测试站点位于http://kinnill.com/dev/eisatech，这听起来非常尴尬，但是有两个单独的模式对话框窗口可以从“关于”和“联系”链接打开。 “关于”对话框打开和关闭完全正常，但“联系”对话框仅在未加载“关于”时加载模态叠加。我在firebug中查看了该站点，似乎如果您尝试加载“联系”对话框，则永远不会创建.ui-overlay div。

javascript调用是：

<script type="text/javascript">
$(function() {

    $( "#dialog-form" ).dialog({
        autoOpen: false,
        height: 420,
        width: 661,
        modal: true
    });

    $( ".contact" )
        .click(function() {
            $( "#dialog-form" ).dialog( "open" );
        });

    $( "#dialog-about" ).dialog({
        autoOpen: false,
        height: 420,
        width: 661,
        modal: true
    });

    $( ".about" )
        .click(function() {
            $( "#dialog-about" ).dialog( "open" );
        }); 

    $(".contact")
        .click(function() {
            $("#dialog-about").dialog("close");
        });

});
</script>

＃dialog-form是“联系人”对话框，＃dialog-about是“关于”对话框。额外的“关闭”调用是因为“关于”对话框中有一个链接可以打开“联系人”对话框。

Answer 1

我将建议一种更好的方法来创建和关闭jquery对话框。即使是我在同一页面上使用更多对话框时遇到了同样的问题，但我明确地以这种方式解决了这个问题：

$( ".about" ).click(function() {
 $("<div />").dialog({
  open: function()
  {
    $(this).html( $( "#dialog-about" ).html());
  },
  height: 420,
  width: 661,
  modal: true,
  close:function()
  {
    $(this).dialog('destroy').remove();
  }
 });
}); 

$( ".contact" ).click(function() {
 $("<div />").dialog({
  open: function()
  {
    $(this).html( $( "#dialog-form" ).html());
  },
  height: 420,
  width: 661,
  modal: true,
  close:function()
  {
    $(this).dialog('destroy').remove();
  }
 });
});

只需动态创建对话框，当您关闭它们时，请完全删除而不会发生冲突。

Jquery模式对话框无法正确加载ui-overlay

1 个答案: