Complemento básico de jQuery EasyUI -Draggable Arrastrable


jQuery EasyUI 插件Complemento de jQuery EasyUI

Reescriba los defaults predeterminados mediante $.fn.draggable.defaults.

Uso

Cree elementos arrastrables (draggable) mediante marcado.

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

Cree elementos arrastrables (draggable) usando javascript.

<div id="dd" style="width:100px;height:100px;">
    <div id="title" style="background:#ccc;">title</div>
</div>
$('#dd').draggable({
    handle:'#title'
});

Propiedades

Nombre Tipo Descripción Valor predeterminado
proxy string,function El elemento proxy que se usará al arrastrar; cuando se establece en 'clone', el elemento clonado se utilizará como proxy. Si se especifica una función, debe devolver un objeto jQuery.
El siguiente ejemplo demuestra cómo crear un objeto 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 boolean Si se establece en true, el elemento volverá a su posición inicial después de que termine el arrastre. false
cursor string El cursor CSS durante el arrastre. move
deltaX number La posición en el eje X del elemento arrastrado en relación con el cursor actual. null
deltaY number La posición en el eje Y del elemento arrastrado en relación con el cursor actual. null
handle selector El controlador (handle) que inicia el arrastre (draggable). null
disabled boolean Si se establece en true, detiene el arrastre (draggable). false
edge number La distancia de arrastre necesaria para iniciar el elemento arrastrable (draggable). 0
axis string Define el eje sobre el que se puede mover el elemento arrastrado; los valores disponibles son 'v' o 'h'. Cuando se establece en null, se moverá en las direcciones 'v' y 'h'. null

Eventos

Nombre Parámetros Descripción
onBeforeDrag e Se activa antes del arrastre; devolver false cancela el arrastre.
onStartDrag e Se activa cuando el objeto de destino comienza a arrastrarse.
onDrag e Se activa durante el arrastre. Devolver false impedirá que se realice el arrastre real.
onStopDrag e Se activa cuando se detiene el arrastre.

Métodos

Nombre Parámetros Descripción
options none Devuelve la propiedad de opciones (options).
proxy none Si se ha establecido la propiedad proxy, devuelve el proxy de arrastre.
enable none Habilita la acción de arrastre.
disable none Deshabilita la acción de arrastre.

jQuery EasyUI 插件Complementos de jQuery EasyUI Otras extensiones