javascript - JQuery 打开弹出对话框不起作用

Question

我试图打开一个弹出窗口，首先执行基本操作，但在页面加载时向我显示对话框，而且按钮不会触发任何内容。

$(document).ready(function() {
        $( "#dialog" ).dialog({ autoOpen: false });
        $( "#opener" ).click(function() {
            $( "#dialog" ).open();
        });
    });

这是我的元素:

<button id="opener">open the dialog</button>
<div id="dialog" title="Dialog Title" hidden="hidden">I'm a dialog</div>

这是我的导入:

<script type="text/javascript" src="scripts/jquery-1.9.1.js"></script>
<script type="text/javascript" src="scripts/jquery-ui-1.11.1.js"></script>
<script type="text/javascript" src="scripts/json.debug.js"></script>

jquery-ui-1.11.1.js 仅包含 Core，不包含 Widget、鼠标和位置。

我做错了什么或忘记导入？

谢谢

Answer 1

点击打开对话框:

 $( "#opener" ).click(function() {
  $('#dialog').dialog('open');
 });

因为您需要在页面加载时显示此内容，所以也在 dom 就绪事件中写入 $('#dialog').dialog('open'); 。

<强> Working Demo