当对话框内的表格内部时,选择不会打开.我包含了问题的代码段
$('select').selectmenu();
$('.RegularDialog').dialog({
autoOpen: false,
modal: true,
height: 500,
width: 570
});
$('#OpenDialog').click(function(e) {
$('.RegularDialog').dialog('open');
});
Run Code Online (Sandbox Code Playgroud)
<head>
<link href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
</head>
<body>
<div id="Dialog" title="Edit Dialog" class="RegularDialog">
<form action="">
<table>
<tr>
<td>Select the Type</td>
<td>
<select id="Type">
<option value="a">Type 1</option>
<option value="b">Type 2</option>
<option value="c">Type 3</option>
</select>
</td>
</tr>
</table>
</form>
</div>
<button id="OpenDialog">Open Dialog</button>
</body>
Run Code Online (Sandbox Code Playgroud)
Cup*_*Tae 11
问题是jQuery UI正在为页面上的选择生成"下拉",但这不在成为弹出窗口的div之外.然后,当显示对话框时,它将覆盖"下拉列表".
如果selectmenu()
在对话框出现后将呼叫移至,则可以正常工作.
您的代码段已更新:
$('.RegularDialog').dialog({
autoOpen: false,
modal: true,
height: 500,
width: 570
});
$('#OpenDialog').click(function(e) {
$('.RegularDialog').dialog('open');
$('select').selectmenu();
});
Run Code Online (Sandbox Code Playgroud)
<head>
<link href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
</head>
<body>
<div id="Dialog" title="Edit Dialog" class="RegularDialog">
<form action="">
<table>
<tr>
<td>Select the Type</td>
<td>
<select id="Type">
<option value="a">Type 1</option>
<option value="b">Type 2</option>
<option value="c">Type 3</option>
</select>
</td>
</tr>
</table>
</form>
</div>
<button id="OpenDialog">Open Dialog</button>
</body>
Run Code Online (Sandbox Code Playgroud)