Javascript 如何将Jquery UI中对话框的宽度固定为窗口的60%

我使用jQueryUI弹出一个窗口，显示一个正在使用Ajax调用填充的表。脚本如下所示

 <script>
  $(function() {
    $( "#dialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "",
        duration: 1000
      }
    });

    $( "#opener" ).click(function() {
      $( "#dialog" ).dialog( "open" );
    });
  });
  </script>

$（函数（）{
$（“#对话框”）。对话框({
自动打开：错误，
展示：{
效果：“盲”，
持续时间：1000
},
隐藏：{
效果：“，
持续时间：1000
}
});
$（“#开场白”）。单击（函数（）{
$（“对话框”）。对话框（“打开”）；
});
});

HTML是非常基本的

    <div id="dialog" title="Preview" style="width:60%">
    SOme COntent here 
<table></table>
    </div>

这里有一些内容

---

当弹出窗口出现时，宽度不会根据表格宽度增加。我想将弹出窗口的宽度固定为窗口大小的60%

我想您需要设置对话框的选项宽度：（从这里开始）

$（“#dialog”）.dialog（“选项”、“宽度”、“60%”）

查看此提琴：
我认为您需要设置对话框的选项宽度：（从这里开始）

$（“#dialog”）.dialog（“选项”、“宽度”、“60%”）

查看此提琴：
您在哪里定义了div标记？@R3tep页面底部？？？@R3tep是的，在开始之前，您可以提供一个实时演示吗？@R3tep嗯，好的，让我试试。问题是Ajax调用我在DIv中有一个选择按钮，用于选择表内容更改，但对话框的宽度保持不变。您在哪里定义了DIv标记？@R3tep页面底部？@R3tep是的，然后才能提供实时演示？@R3tep嗯，好的，让我试试。问题是Ajax调用我在DIv中有一个select按钮，用于选择表内容更改，但对话框的宽度保持不变