I have a draggable <div>
with a click
event and without any event for drag,
but after I drag <div>
the click event is apply to <div>
.
How can prevent of click event after drag?
$(function(){ $('div').bind('click', function(){ $(this).toggleClass('orange'); }); $('div').draggable(); });
http://jsfiddle.net/prince4prodigy/aG72R/
Advertisement
Answer
I made a solution with data
and setTimeout
. Maybe better than helper classes.
<div id="dragbox"></div>
and
$(function(){ $('#dragbox').bind('click', function(){ if($(this).data('dragging')) return; $(this).toggleClass('orange'); }); $('#dragbox').draggable({ start: function(event, ui){ $(this).data('dragging', true); }, stop: function(event, ui){ setTimeout(function(){ $(event.target).data('dragging', false); }, 1); } }); });
Check the fiddle.