Evitar el evento de clic de JavaScript con arrastrar y soltar Scriptaculous

events event-handling

Question

Tengo algunos elementos en una página que se pueden arrastrar. Estos mismos elementos tienen un evento de clic que navega a otra página. Estoy intentando determinar la mejor forma de evitar que el evento de clic se active si el usuario está arrastrando, pero aún así permitir el evento click si no se está arrastrando. ¿Alguien tiene alguna idea de la mejor manera de lograr esto?

Answer 1

var click_func;
function onDragStart(drgObj,mouseEvent){
click_func = mouseEvent.target.onclick;
mouseEvent.target.onclick = function(e){
mouseEvent.target.onclick = click_func;
return false;
}
}

Answer 2

Algo como lo siguiente podría hacer el truco (y evitar que el evento click se active)

new Draggable(''tag'',
{
revert:function()
{
$(''tag'').onclick = function(){return false;};
setTimeout(''$(/'tag/').onclick = function(){return true;}'',''500'');
return true;
}
}
);

Answer 3

Lo solucioné usando algo como lo siguiente:

new Draggable(''id'', {
onStart: function() {
dPhoto = $(''id'');
Event.stopObserving(''id'', ''click'');
},
onEnd : function() {
setTimeout("Event.observe(''id'', ''click'', function() { location.href = ''url''; });", 500);
},
revert: true
});

Answer 4

También puedes hacer esto de otra manera. En su startDrag deja de observar el objeto. Luego observa nuevamente el clic que lleva a una función enddrag que recrea el primer controlador de eventos.

function onDragStart() {
Event.stopObserving(this.OBJECT,''click'');
Event.observe(this.OBJECT,''click'',this.onDragEnd.bindAsEventListener(this));
}
function onDragEnd() {
Event.stopObserving(this.OBJECT,''click'');
Event.observe(this.OBJECT,''click'',this.PREVIOUSFUNCTION.bindAsEventListener(this));
}

Esto capturará el evento de clic sobrante que aún está activo después del enddrag para recrear el controlador original. Espero que esto ayude a alguien por ahí :)