Skip to main content
 首页 » 编程设计

jQuery ui 全屏对话框

2026年07月28日8虾米姐

我正在尝试使用 jquery ui 创建全屏对话框。

我通过ajax加载了一些内容,结果填充了对话框:

function openResource(id) { 
  $.ajax({ 
    url      : "", 
    type     : 'post', 
    dataType : 'html', 
    data : { 
      idRes: id 
    }, 
    success : function(response) { 
      $("#popupRecurso") 
        .html("<div style='float:right; cursor: pointer;' onclick='$(\"#popupRecurso\").dialog(\"destroy\");'>fechar</div>" + response); 
 
      $("#popupRecurso").dialog({ 
        title       : '', 
        bgiframe    : true, 
        position    : 'center', 
        draggable   : false, 
        resizable   : false, 
        dialogClass : 'dialogRecurso', 
        width       : $(window).width(), 
        height      : $(window).height(), 
        stack       : true, 
        zIndex      : 99999, 
        autoOpen    : true, 
        modal       : true, 
        open        : function() { 
          $(".ui-dialog-titlebar").hide(); 
        }, 
        error : function(err) { 
          alert(err);    
        } 
      }); 
    } 
  }); 
} 

不幸的是,该对话框没有出现在中心并且没有正确的尺寸。 有人遇到过同样的问题吗?

谢谢

请您参考如下方法:

我希望在 jfiddle 中看到这一点,以便更好地理解可能影响这一点的任何变量差异。尝试删除对话框属性的“宽度”和“高度”设置,并将宽度:100%和高度:100%的CSS属性添加到您为对话框内容调用的容器中。 “#popupRecurso”。这样对话框属性就不会覆盖它,并且它会随着任何大小的 DOM 更改事件而更改。我目前在公司经常使用模态,并且遇到过类似的问题。我喜欢将 css 属性设置为宽度:%120,高度:120%。这样,即使用户放大或缩小,您正在寻找的对话框功能也能保持真实。希望这会对您有所帮助。快乐编码!