javascript - 在 jquery 中自动调整大小后重新定位对话框

Question

我有一个显示动态大小表单的对话框。我目前使用以下代码让对话框自动调整大小。我希望它做的是在调整大小事件发生后自动重新定位对话框。这是因为对话框调整了宽度，我希望它在页后记中保持居中。

  $("#form-div").dialog({
      autoOpen: false,
      width: "auto",
      height: "auto",
      resize: "auto",
      modal: true
  });

  $("#show-form-button").click(function() {
      $("#form-div").dialog("open");
  });

编辑:

只是为了清楚

对话框显示一个表单。显示窗体后，可能会向窗体添加其他字段，导致它不再适合原始对话框。 “resize: 'auto' ”选项会自动处理这个问题并调整对话框的大小。我希望对话框在自动调整大小后居中。

Answer 1

根据文档，调整大小完成后有一个 resizeStop Hook 。所以你应该能够做这样的事情:

$("#form-div").dialog({
      autoOpen: false,
      width: "auto",
      height: "auto",
      resize: "auto",
      modal: true,
      resizeStop: function(event, ui) {
        jQuery(this).dialog('option','position','center');
      }
 });

 $("#show-form-button").click(function() {
     $("#form-div").dialog("open");
 });