jQuery EasyUI 窗口插件 -Window

jQuery EasyUI 插件jQuery EasyUI Плагины

继承自 $.fn.panel.defaults。通过 $.fn.window.defaults 覆盖默认的 defaults.

窗口是一个浮动的、可拖拽的面板，可以用作应用程序窗口。默认情况下，窗口可以移动、调整大小和关闭。它的内容可以通过静态 HTML 定义，或者通过 AJAX 动态加载。

Зависимости

  • draggable
  • resizable
  • panel

Использование

创建窗口

1. 从标记创建窗口。

<div id="win" class="easyui-window" title="My Window" style="width:600px;height:400px"
    data-options="iconCls:'icon-save',modal:true">
    Window Content
</div>

2. Создайте окно с помощью JavaScript.

<div id="win"></div>

$('#win').window({
    width:600,
    height:400,
    modal:true
});

3. Создайте окно с составной компоновкой.

Как обычно, вы можете определить компоновку окна. Пример ниже демонстрирует, как разделить область окна на две части: северную область и центральную область.

<div id="win" class="easyui-window" title="My Window" style="width:600px;height:400px"
    data-options="iconCls:'icon-save',modal:true">
    <div class="easyui-layout" data-options="fit:true">
        <div data-options="region:'north',split:true" style="height:100px"></div>
        <div data-options="region:'center'">
            The Content.
        </div>
    </div>
</div>

Действия с окном

Открыть и закрыть окно.

$('#win').window('open'); // open a window
$('#win').window('close'); // close a window

Загрузить содержимое окна через AJAX.

$('#win').window('refresh', 'get_content.php');

Свойства

Эти свойства наследуются от панели. Ниже приведены свойства, переопределённые и добавленные для окна.

Name Type Описание Значение по умолчанию
title string Текст заголовка окна. Новое окно
collapsible логическое значение Определяет, показывать ли кнопку сворачивания. истина
minimizable логическое значение Определяет, показывать ли кнопку минимизации. истина
maximizable логическое значение Определяет, показывать ли кнопку развертывания. истина
closable логическое значение Определяет, отображать ли кнопку закрытия. истина
closed логическое значение Определяет, закрывать ли окно. false
zIndex число z-index окна, с которого начинается увеличение. 9000
draggable логическое значение Определяет, можно ли перетаскивать окно. истина
resizable логическое значение Определяет, можно ли изменить размер окна. истина
shadow логическое значение Если задано значение true, тень будет отображаться, когда окно может показывать тень. истина
inline логическое значение Определяет, как разместить окно. Если задано значение true, оно помещается в родительский контейнер; если задано значение false, оно отображается поверх всех элементов. false
modal логическое значение Определяет, является ли окно модальным окном. истина

Events

Эти события наследуются от panel.

Методы

Эти методы наследуются от panel. Ниже приведены методы, добавленные для окна.

Name Параметр Описание
window none Возвращает внешний объект окна.
hcenter none Центрирует окно по горизонтали. Этот метод доступен начиная с версии 1.3.1.
vcenter none Центрирует окно по вертикали. Этот метод доступен начиная с версии 1.3.1.
center none Центрирует окно. Этот метод доступен начиная с версии 1.3.1.
jQuery EasyUI 插件Плагины jQuery EasyUI Другие расширения