Hi I am working on a click double-click event handler for my jquery ajax engine. The idea is that you can click or double-click a button. I wrote this myself but I don't see why it is not working.
this is the code:
$('body').on('click', '.double-click', function() {
var that = this;
var dblclick = $(that).data('clicks');
if(!dblclick){
dblclick = 0;
}
dblclick = dblclick + 1;
$(that).data('clicks', dblclick);
dblclick = $(that).data('clicks');
console.log('click - ' + dblclick);
if(dblclick > 1){
$(this).data('clicks', 0);
//ajaxloader(this, 1);
alert('dubbel-klik');
console.log('dubbelcik event');
}
setTimeout(function() {
if(dblclick == 1){
$(that).data('clicks', 0);
//ajaxloader(this, 0);
alert('klik');
console.log('single click event');
}
}, 400);
});
It maybe looks a little over complicated but that is because I tried out some stuff. The problem I have is that when I double-click the double click the single click gets also executed. How is this possible when I reset with $(this).data('clicks', 0);
. Then the counter has to be 0 and the if statement in the timeout has to be false.
Someone knows what is going wrong!?
O yes see a working demo here: click the click en dubbelclick button