JQueryを使用して特定のボタンが押されたときにダイアログを開くページがあります。しかし問題は、コンテンツとダイアログ自体が大きすぎるということです。私はJQueryでダイアログのサイズを調整できることを知っています(実際には幅を1500に設定してください。そうでなければ、中間にスライスされるように見えます)。JQueryダイアログ内の要素が大きすぎます
$(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>
あなたは、ダイアログのサイズ(内部コンテンツ)がボタンよりも大きい方法であることがわかります。どうすればそれを正しく設定できますか?
正常に動作します! –
'resize'属性のみが利用可能です。 –
'size =" 65 "'?!あなたは何をサイズ変更していますか? –