jQuery EasyUI Basis-Plugin -Draggable

jQuery EasyUI 插件jQuery EasyUI Plugin

Überschreiben Sie die Standardwerte über $.fn.draggable.defaults.

Nutzung

Erstellen Sie draggable-Elemente über Markup.

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

Erstelle ziehbare Elemente mit JavaScript.

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

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

Eigenschaften

Name Type Beschreibung Standardwert
proxy string,function Das Proxy-Element, das beim Ziehen verwendet werden soll. Wenn es auf 'clone' gesetzt ist, wird das geklonte Element als Proxy verwendet. Wenn eine Funktion festgelegt ist, muss sie ein jQuery-Objekt zurückgeben.
Das folgende Beispiel zeigt, wie ein einfaches Proxy-Objekt erstellt wird.
$('.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 boolesch Wenn auf true gesetzt, kehrt das Element beim Beenden des Ziehens an seine Ausgangsposition zurück. false
cursor string Der CSS-Cursor, der beim Ziehen verwendet werden soll. move
deltaX number Die X-Achsen-Position des gezogenen Elements relativ zum aktuellen Cursor. null
deltaY number Die Y-Achsen-Position des gezogenen Elements relativ zum aktuellen Cursor. null
handle selector Der Griff, der zum Einleiten des Ziehens verwendet wird. null
disabled boolesch Wenn auf true gesetzt, wird das draggable deaktiviert. false
edge number Die Breite, innerhalb derer das Ziehen eingeleitet werden kann. 0
axis string Definiert die Achse, auf der sich das gezogene Element bewegen kann. Verfügbare Werte sind 'v' oder 'h'. Wenn auf null gesetzt, bewegt es sich entlang beider Richtungen 'v' und 'h'. null

Ereignisse

Name Parameters Beschreibung
onBeforeDrag e Wird vor dem Ziehen ausgelöst; wenn false zurückgegeben wird, wird das Ziehen abgebrochen.
onStartDrag e Wird ausgelöst, wenn das Zielobjekt mit dem Ziehen beginnt.
onDrag e Wird während des Ziehens ausgelöst. Wenn false zurückgegeben wird, wird das tatsächliche Ziehen nicht ausgeführt.
onStopDrag e Wird ausgelöst, wenn das Ziehen beendet wird.

Methoden

Name Parameters Beschreibung
options none Gibt die Eigenschaft options zurück.
proxy none Gibt den Drag-Proxy zurück, wenn die Eigenschaft proxy gesetzt ist.
enable none Aktivieren Sie die Ziehaktion.
disable none Deaktivieren Sie die Ziehaktion.
jQuery EasyUI 插件jQuery EasyUI Plugin Weitere Erweiterungen