jQuery UI 对话框在拖动后自动停止调整大小

Question

我有一个 jQuery UI 对话框，其中包含一个可以根据用户做出的选择进行扩展的表单：http://i.imgur.com/KsskHBC.png。

例如，如果用户将“答案类型”更改为数字，则会将内容添加到对话框中（或从中删除）：http://i.imgur.com/qH3gmHP.png。

因此，如果用户打开对话框，选择将展开对话框而不移动它，对话框将正常调整大小，如上图所示。但是，如果用户拖动对话框然后做出展开对话框的选择，它不会自动调整大小：http://i.imgur.com/0YEvD5t.png。

这就是我初始化对话框的方式：

var dialogToShow = isDeleteConfirmDialog ? $("#confirmDeleteDialog") : $("#customDialog");

dialogToShow.dialog({
    // autoResize: true, -- does not work neither
    resizable: false,
    title: "My title",
    modal: true,
    width: 'auto',
    height: 'auto',
    draggable: false,
    hide: { effect: 'scale', duration: 400 },
    open: function () {
        $('.ui-widget-overlay').bind('click', function () { dialogToShow.dialog('close'); });
    }
});
dialogToShow.parent().draggable();

我也尝试将对话框的位置设置为absolute，但没有任何改变。

我制作了一个 JSFiddle 来查看是否可以重现我的问题，并且确实可以：https://jsfiddle.net/BishopBarber/61jqhsgt/2/

编辑：这在最新版本的 IE 中似乎不是问题，因此可能是一个错误

Answer 1

在执行了几次测试后，我意识到这是在 jQuery UI 版本 1.11.2 到 1.11.4 中出现的错误。后续和之前的版本似乎都没有这个问题。如果您不想更改您的版本，Mark Schultheiss 建议的解决方法就是。

Answer 2

如果您删除动画，然后关闭/打开更改，我相信它会起作用。不理想，但可以解决这个问题。

请注意，如果您将其设置为不自动打开，则可以删除“隐藏”样式。（参见小提琴标记）

重做的代码：

$(function() {
  var dialogToShow = $("#customDialog");
  dialogToShow.dialog({
    resizable: false,
    title: "Dialog",
    modal: true,
    width: 'auto',
    height: 'auto',
    draggable: false,
    // hide: {
    //    effect: 'scale',
    //    duration: 400
    //  },
    autoOpen: false
  });
  dialogToShow.parent().draggable();
  $(document).on('click', '.ui-widget-overlay', function() {
    dialogToShow.dialog('close');
  });
  $("#openDialogBtn").on("click", function() {
    dialogToShow.dialog("open");
  });
  $("#questionType").change(function() {
    if ($(this)[0].selectedIndex === 1) {
      $("#controlEditor").html($("#loremIpsum").html());
    } else {
      $("#controlEditor").html("");
    }
    dialogToShow.dialog("close").dialog("open");
  });
});

小提琴更新：https://jsfiddle.net/MarkSchultheiss/61jqhsgt/3/