0

我有这段代码可以根据 2 个链接打开一个带有特定控件的 JQuery 对话框。现在它在第一次尝试时工作正常。但是当我第二次单击链接加载 JQuery 对话框时,它会打开一个空白对话框。在关闭它并再次单击链接时,它会打开正确的对话框。在反复试验中,它在 JQuery 1.3.2.js 文件中引发了一个错误。

代码如下:

 $('#div1').dialog("destroy");            

 if (criteria1== "L") {
    $("#div1").html("<iframe id='dialogFrame1' src='../WebPages/abc.aspx'        
    Height='100%' Width='100%' frameborder='0'></iframe>");
  }
 else {
    $("#div1").html("<iframe id='dialogFrame2' src='../WebPages/abc1.aspx'    
  Height='100%' Width='100%' frameborder='0'></iframe>");
 }

 $('#div1').dialog(
 {

  height: 220,
  title: "Title",
  width: 500,
  modal: true,
  beforeclose: function (event, ui) {

      $("#div1").html("");
      $("#div1")[0].innerHTML = "";
    }

 });

 $('#div1').parent().appendTo($("form:first"));
 $('#div1').dialog('open');

我使用了错误的 JQuery 文件吗?有关如何解决此问题的任何意见?

4

2 回答 2

0

编辑:误解了问题,第二次尝试:

无法重现您的问题,已在http://jsfiddle.net/GYxwG/3/尝试过。但是,我确实必须删除您的$('#div1').parent().appendTo($("form:first"));,因为它根本无法使用。这个语句可能不会像你想象的那样做,因为一旦你.dialog()在 div 上调用 div,div 就会从它的位置移出并包裹在各种对话中。所以.parent()指的是对话框的内部包装之一。不是整个对话框,也不是原始文档中的父元素。

因此,将最近的父级移动到对话框的 div 几乎没有意义,并导致“未指定”行为,也许您看到了一些极端情况?

于 2010-09-27T12:35:57.470 回答
0

jsfiddle 工作示例(它缺少 jquery css/images)

因此,如果我可能建议废弃您提供的代码,它似乎是一团糟,而是这样做:

$(function(){
    var urls = {
        "hackernews" : "http://news.ycombinator.com", 
        "jsfiddle" : "http://jsfiddle.net"
    };

    var dialog = $("<div style='width:50%;height:50%;'>\
                   <iframe id='dialogFrame'\
                   src='#'  frameborder='0'></iframe></div>");


     dialog.dialog({
      height: 220, 
      title: "Title",
      width: 500,
      modal: true,
      autoOpen: false
    });

    $('#btn1, #btn2').click(
        function(){
            var urlIndex = $(this).attr('rel');
            if(!urlIndex) return;
            $('#dialogFrame', dialog).attr('src', urls[urlIndex]);
            dialog.dialog('open');
         }
    );
    $('#btnClose').click(
        function(){
            dialog.dialog('close');
        }
    );

});​</p>

HTML:

<input type="button" id="btn1" rel="jsfiddle" value="dialog1" />
<input type="button" id="btn2" rel="hackernews" value="dialog2" />
<input type="button" id="btnClose" value="Close">​

因此,我们不是在对话框之间切换和更改内部 HTML,而是保持一个对话框始终可用,当它要显示时,我们设置 iframe 的 url 并显示对话框。

所有 url 都保存在一个关联数组中,click 事件处理程序检查单击按钮的 rel 属性以确定应该显示哪个 url。

说得通?

您显然需要更改 HTML 和 dialo-properties 的 URL 和属性。

于 2010-09-28T08:57:18.613 回答