Question

我正在尝试创建一个包含表和多行的对话框。用户单击按钮时会出现该对话框。我创建了我的对话框，它似乎工作，但当我刷新页面时，我甚至在单击按钮之前就看到了页面顶部框的内容（表格）。单击按钮后，表格将在对话框中正确显示，并从页面顶部删除。

有没有办法在刷新页面时隐藏顶部表格，只在单击对话框按钮时显示它？

function popupRackParamChecker(){
  $("#dialog-rackParams").dialog({
      resizable: false,
      height: 550,
      width: 350,
      modal: true,
      draggable: false,
      buttons: {
      Confirm: function() {
        $( this ).dialog( "close" );
      }
    }
  });
}

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id="dialog" title="Parameters">
<table id="users" class="ui-widget ui-widget-content">
    <thead>
        <tr class="ui-widget-header ">
            <th>Name</th>
            <th>Email</th>
            <th>Password</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Kevin</td>
            <td>Kevin@example.com</td>
            <td>Kevin</td>
        </tr>
    </tbody>
</table>
</div>

Answer 1

我找到了解决方案，我只需要在html中设置style="display:none"

<div id="dialog-rackParams" title="Rack Parameters" style="display:none">

带有桌子的Javascript对话框

1 个答案: