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?
JavaScript
x
8
1
$(function(){
2
$('div').bind('click', function(){
3
$(this).toggleClass('orange');
4
});
5
6
$('div').draggable();
7
});
8
http://jsfiddle.net/prince4prodigy/aG72R/
Advertisement
Answer
I made a solution with data
and setTimeout
. Maybe better than helper classes.
JavaScript
1
2
1
<div id="dragbox"></div>
2
and
JavaScript
1
18
18
1
$(function(){
2
$('#dragbox').bind('click', function(){
3
if($(this).data('dragging')) return;
4
$(this).toggleClass('orange');
5
});
6
7
$('#dragbox').draggable({
8
start: function(event, ui){
9
$(this).data('dragging', true);
10
},
11
stop: function(event, ui){
12
setTimeout(function(){
13
$(event.target).data('dragging', false);
14
}, 1);
15
}
16
});
17
});
18
Check the fiddle.