Javascript 将jQueryUI对话框上的高度调整为与内容一样高,最大为
使用jQueryUI的对话框,我想弹出信息。我的问题是,我想将对话框的高度设置为内容的高度。如果我不指定高度,这就完美了。根据内容的高度自动计算高度。问题是如果内容非常高,对话框也会变得非常高,并在窗口下方显示。。。在这种情况下,maxHeight也不能很好地工作 所以我已经能够通过在显示弹出窗口后调整高度和位置来解决这个问题。然而,在加载内容(通过ajax)时,它会在屏幕下方运行。只有完成之后,我才能重新调整窗户。我宁愿不要那样尴尬的耽搁 更新:事实证明我想要的不仅仅是maxHeight。我想要一个最大初始高度。因此,在加载带有数据的对话框后,它只能增长到一定的高度。但之后,您可以扩展窗口。要做到这一点非常容易:Javascript 将jQueryUI对话框上的高度调整为与内容一样高,最大为,javascript,jquery,html,css,jquery-ui,Javascript,Jquery,Html,Css,Jquery Ui,使用jQueryUI的对话框,我想弹出信息。我的问题是,我想将对话框的高度设置为内容的高度。如果我不指定高度,这就完美了。根据内容的高度自动计算高度。问题是如果内容非常高,对话框也会变得非常高,并在窗口下方显示。。。在这种情况下,maxHeight也不能很好地工作 所以我已经能够通过在显示弹出窗口后调整高度和位置来解决这个问题。然而,在加载内容(通过ajax)时,它会在屏幕下方运行。只有完成之后,我才能重新调整窗户。我宁愿不要那样尴尬的耽搁 更新:事实证明我想要的不仅仅是maxHeight。我想
$('<div><div></div></div>').attr('title', options.title).appendTo('body').dialog({
open: function() {
$(this).children().css('maxHeight', maxInitialHeight).load(url, function() {
thisDialog.$dialog.dialog('option', 'position', 'center');
});
}
});
$(“”).attr('title',options.title).appendTo('body')。对话框({
打开:函数(){
$(this).children().css('maxHeight',maxInitialHeight).load(url,function()){
thisDialog.$dialog.dialog('option','position','center');
});
}
});
这将动态地从“url”加载一个对话框,其内容最高可达maxInitialHeight。嵌套的两个div是必需的。您可以在
中插入内容,并使该div成为对话框的内容
然后,您可以使用CSS为您的div.dialog-data
指定max height
和overflow:auto
,可能如下所示
options.open = function() {
var dialog = $(this).dialog('widget');
var content = dialog.find('.ui-dialog-content');
$.ajax({
url: 'this your url',
success: function(result, status, xhr) {
content.empty().append(result);
content.dialog(
'option',
{
// this your options
}
);
};
});
};
这里有一个更简洁的方法,对我来说是有效的
$(targetElement).css('max-height', '400px').dialog({
'resize' : function() {
$(this).css('max-height', '1000px');
}
});
首先设置要放入对话框的对象的最大高度。它在屏幕上显示的大小不超过400px。
但一旦你开始拖动它,限制就会解除。
... 正是我想要的,而且更干净的代码
我也试图将“最大高度”设置回“自动”,但没有;t似乎无法坚持,所以1000px对我来说是可以的。这是一个有趣的建议,因为最初认为这会导致内部div比对话框展开时的对话框小得多。但后来我意识到我希望整个对话框都有一个最大高度。所以我只是让它们在上面有相等的最大高度(对话框必须是52像素或更高的标题栏)。因此,如果不进行测试,您的解决方案似乎是有效的。但我想我的解决办法是更可取的,即使在一开始疯狂扩大窗口,因为它允许一个初始最大高度。我在想我怎样才能为你的解决方案做同样的事情。我在上面发布了我的解决方案,结果有点简单。你的建议给了我这个想法,并且接近解决方案,所以我相信你的答案是正确的。我不明白你想做什么。$内容是否与$相同(此)?还是仅仅是满足?在这种情况下,您是在对话框中创建对话框吗?好吧,如果我理解正确,那么基本上您是建议完全加载ajax,然后附加它,maxHeight选项将正常工作?也许吧,但我有一个更好的解决办法。