jQuery EasyUI Plugin de base -Draggable

jQuery EasyUI 插件jQuery EasyUI Plugin

Remplacer les valeurs par défaut via $.fn.draggable.defaults.

Utilisation

⟦⟧Créer des éléments déplaçables via le balisage.

<div id="dd" class="easyui-draggable" data-options="handle:'#title'" style="width:100px;height:100px;">
    <div id="title" style="background:#ccc;">title</div>
</div>

Créer des éléments déplaçables avec JavaScript.

<div id="dd" style="width:100px;height:100px;">
    <div id="title" style="background:#ccc;">title</div>
</div>

$('#dd').draggable({
    handle:'#title'
});

Propriétés

Name Type Description Valeur par défaut
proxy string,function L'élément proxy à utiliser lors du glissement. Lorsque la valeur est 'clone', l'élément cloné est utilisé comme proxy. Si une fonction est spécifiée, elle doit renvoyer un objet jQuery.
L'exemple ci-dessous montre comment créer un objet proxy simple.
$('.dragitem').draggable({
    proxy: function(source){
        var p = $('<div style="border:1px solid #ccc;width:80px"></div>');
        p.html($(source).html()).appendTo('body');
        return p;
    }
});
null
revert booléen Si défini sur true, l'élément retournera à sa position de départ à la fin du glissement. false
cursor string Le curseur CSS à utiliser pendant le glissement. move
deltaX nombre La position sur l'axe X de l'élément déplacé par rapport au curseur actuel. null
deltaY nombre La position sur l'axe Y de l'élément déplacé par rapport au curseur actuel. null
handle selector La poignée utilisée pour initier le glissement. null
disabled booléen Si défini sur true, désactive le glisser-déposer. false
bord nombre La largeur dans laquelle le glissement peut être initié. 0
axis string Définit l'axe sur lequel l'élément glissé peut se déplacer. Les valeurs disponibles sont 'v' ou 'h'. Lorsqu'il est défini sur null, il se déplace dans les deux directions 'v' et 'h'. null

Événements

Name Parameters Description
onBeforeDrag e Déclenché avant le glissement ; renvoyer false annule le glissement.
onStartDrag e Déclenché lorsque l'objet cible commence à glisser.
onDrag e Déclenché pendant le glissement. Renvoyer false n'effectuera pas le glissement réel.
onStopDrag e Déclenché lorsque le glissement s'arrête.

Méthodes

Name Parameters Description
options none Renvoie la propriété options.
proxy none Renvoie le proxy de glissement si la propriété proxy est définie.
enable none Active l'action de glisser.
disable none Désactive l'action de glisser.
jQuery EasyUI 插件jQuery EasyUI Plugin Autres extensions