jQuery EasyUI Window Plugin -Fenêtre

jQuery EasyUI 插件Plugins jQuery EasyUI

Hérite de $.fn.panel.defaults. Remplacez les valeurs par défaut via $.fn.window.defaults.

La fenêtre est un panneau flottant déplaçable qui peut être utilisé comme fenêtre d'application. Par défaut, la fenêtre peut être déplacée, redimensionnée et fermée. Son contenu peut être défini via du HTML statique, ou chargé dynamiquement via AJAX.

Dépendances

  • draggable
  • redimensionnable
  • panel

Utilisation

Créer une fenêtre

1. Créer une fenêtre à partir du balisage.

<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. Créer une fenêtre en JavaScript.

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

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

3. Créer une fenêtre avec une mise en page composite.

Comme d'habitude, vous pouvez définir la disposition de la fenêtre. L'exemple ci-dessous montre comment diviser la zone de la fenêtre en deux parties : la région nord et la région centrale.

<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>

Actions de la fenêtre

Ouvrir et fermer la fenêtre.

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

Charger le contenu de la fenêtre via AJAX.

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

Propriétés

Ces propriétés étendent celles du panneau. Ci-dessous figurent les propriétés redéfinies et ajoutées pour la fenêtre.

Name Type Description Valeur par défaut
title string Le texte du titre de la fenêtre. Nouvelle fenêtre
collapsible booléen Définit s'il faut afficher le bouton de réduction. vrai
minimizable booléen Définit s'il faut afficher le bouton de minimisation. vrai
maximizable booléen Définit s'il faut afficher le bouton d'agrandissement. vrai
closable booléen Définit s'il faut afficher le bouton de fermeture. vrai
closed booléen Définit si la fenêtre doit être fermée. false
zIndex nombre Le z-index de la fenêtre à partir duquel commencer à augmenter. 9000
draggable booléen Définit si la fenêtre peut être déplacée. vrai
redimensionnable booléen Définit si la fenêtre peut être redimensionnée. vrai
shadow booléen Si défini sur true, une ombre sera affichée lorsque la fenêtre est en mesure d'afficher une ombre. vrai
inline booléen Définit comment placer la fenêtre. Lorsque défini sur true, elle est placée dans son conteneur parent ; lorsque défini sur false, elle flotte au-dessus de tous les éléments. false
modal booléen Définit si la fenêtre est une fenêtre modale. vrai

Événements

Ces événements héritent de ceux du panneau.

Méthodes

Ces méthodes héritent de celles du panneau. Ci-dessous se trouvent les méthodes ajoutées pour la fenêtre.

Name Paramètre Description
window none Retourne l'objet de fenêtre externe.
hcenter none Centre la fenêtre horizontalement. Cette méthode est disponible depuis la version 1.3.1.
vcenter none Centre la fenêtre verticalement. Cette méthode est disponible depuis la version 1.3.1.
center none Centre la fenêtre. Cette méthode est disponible depuis la version 1.3.1.
jQuery EasyUI 插件Plugins jQuery EasyUI Autres extensions