javascript - 如何在 Div 中按下按钮

Question

我有按钮并在弹出窗口中选择下拉菜单。但由于某种原因，我无法将按钮移动到下拉列表下方的位置。

我尝试将它们放在不同的表格行中，但没有帮助。

这是我的代码

$(".form").button();
$("#popup").dialog({
  title: "Test",
  modal: true
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<div id="popup" style="overflow:scroll;">
  <table>
    <tr>
      <select style="width:100px;">
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        <option>5</option>
        <option>6</option>
        <option>7</option>
      </select>
    </tr>
    <tr>
      <input type="button" class="form" value="Save">
    </tr>
  </table>
</div>

Answer 1

您错过了<td></td>

$(".form").button();
$("#popup").dialog({
  title: "Test",
  modal: true
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<div id="popup" style="overflow:scroll;">
  <table>
    <tr>
      <td>
          <select style="width:100px;">
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
            <option>5</option>
            <option>6</option>
            <option>7</option>
          </select>
        </td>
    </tr>
    <tr>
      <td>
          <input type="button" class="form" value="Save">
       </td>
    </tr>
  </table>
</div>