javascript - 我可以强制对话框只能在窗口内拖动吗？

Question

html:

    <div id="dialog" title="Past Issues">
    </div>

查询：

$( "#dialog" ).dialog({
        height: 900,
        width:1200,
        modal: true,
});

问题是当前对话框可以拖到几厘米的窗口区域，是否可以设置包含窗口？或者默认设置已经是遏制：窗口？如果是，问题的根源是什么？谢谢。

Answer 1

传递给对话框使用的可拖动小部件的默认containment选项确实是document，不是window。

您可以通过使用data()获取对话框小部件来覆盖此默认值，然后访问其uiDialog成员并在那里修改可拖动的containment选项：

$("#dialog").dialog({
    height: 900,
    width: 1200,
    modal: true
}).data("ui-dialog").uiDialog.draggable("option", "containment", "window");

Answer 2

试试这个，对于演示，我使用了一个div你可以替换它window

$("#dialog").dialog({
    open: function(event, ui) {
        var vDlg = $(event.target).parent();
        var vCont = $('#main');   // for window use - $(window);
        vDlg.draggable("option", "containment", vCont).appendTo(vCont);
        $(this).dialog("option", "position", "center");
    }
});​

在这里演示