我有一个使用 JQuery 并在按下特定按钮时打开对话框的页面。但问题是内容和对话本身太大了。我知道在 JQuery 中我可以调整对话框的大小(我实际上是通过将宽度设置为 1500 来实现的,否则它会在中间出现切片),但是内容?
$(document).ready(function() {
var dialogAddPartDiv = $('#dialogAddPart');
$('#showDialogButton').click(function() {
dialogAddPartDiv.dialog('open');
});
dialogAddPartDiv.dialog({
autoOpen: false,
modal: true,
buttons: {
'Save': function() {}
},
beforeClose: function(event) {
if (!confirm("It won't be saved. Continue?")) {
return false;
} else {}
},
width: 1500
});
});
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<body>
<button type="button" id="showDialogButton">+Show Dialog</button>
<div id="dialogAddPart">
<table>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td><input type="text" size="80" value=""></td>
</tr>
<tr>
<td>Test:</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td><input type="text" size="80" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
<tr>
<td>Test</td>
<td><input type="text" size="65" value=""></td>
</tr>
</table>
</div>
</body>
您会看到对话框的大小(和里面的内容)比按钮大得多。我怎样才能正确设置它?
最佳答案
由于您正在使用这个属性,您的表更大了
size="85"
默认情况下,表采用您的案例“85”中定义的所有列的最大值
只需删除它们并尝试,它工作正常
关于javascript - JQuery 对话框中的元素太大,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47968562/