初始化后如何调整 Jquery 对话框的宽度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/877573/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to resize width of a Jquery dialog after initialization
提问by Draco
I'm trying to change the width of a JQuery dialog after it has been initialized. Here is my initialization:
我试图在初始化后更改 JQuery 对话框的宽度。这是我的初始化：
$(function() {
$("#dialogContainer").dialog({
title: 'Some title',
resizable: false,
bgiframe: true,
overlay: { opacity: 0.3, background: "white" },
position: [200, 200],
autoOpen: false,
height: 150,
width: 'auto'
modal: true,
buttons: {
'ok': function() {
$(this).dialog('close');
}
}
});
});
});
});
And this is what I am doing to change the width of it in some other function:
这就是我在其他一些函数中改变它的宽度所做的事情：
$("#dialogBox").dialog('option','width',700);
But this doesn't work. The width of the dialog is the width of the paragraph that's first displayed in it. Was I suppose to do anything else?
但这不起作用。对话框的宽度是首先显示在其中的段落的宽度。我应该做点别的吗？
Here is the html for the dialog:
这是对话框的html：
<div id = 'dialogContainer'>
<p id = 'message'></p>
</div>
采纳答案by kgiannakakis
Make sure that you are using ui.resizable.js and ui.resizable.css
确保您使用的是 ui.resizable.js 和 ui.resizable.css
回答by biniam
Initialize the dialog with the width option specified:The width of the dialog is in pixels.
使用指定的宽度选项初始化对话框：对话框的宽度以像素为单位。
$( "#dialogBox" ).dialog({ width: 500 });
Get or set the width option, after initialization:
初始化后获取或设置宽度选项：
// getter
var width = $( "#dialogBox" ).dialog( "option", "width" );
// setter
$( "#dialogBox" ).dialog( "option", "width", 500 );
Source: http://api.jqueryui.com/dialog/
回答by Khandad Niazi
HERE IS SHORT SOLUTION, But remember it is only for predefined dialog.
这是简短的解决方案，但请记住它仅适用于预定义的对话框。
$( "#dialog" ).dialog({minHeight: 300,minWidth:500});
回答by Josh
Try this:
尝试这个：
$("#dialogID").data("width.dialog", 160);
回答by dllhell
$("#dialogID").css("width", 160);
回答by Fumisky Wells
This works for me. The point is to resize afteropen it:
这对我有用。关键是打开后调整大小：
$('#dialogContainer').
dialog('open').
dialog('option', 'width', 'auto').
dialog('option', 'height', 'auto');
jQuery version in my case is 1.11:
我的 jQuery 版本是 1.11：
> Query.fn.jquery
> "1.11.1"
回答by Dave
$("#dialogweb").dialog({width:'90%'});
