Jquery UI selectmenu无法在对话框中工作

Nic*_*ick 6 jquery jquery-ui

当对话框内的表格内部时,选择不会打开.我包含了问题的代码段

$('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)