Prevent double click - tap on links -buttons?

[Manmade]

I need to prevent doubleclick on all links and buttons in my app done
with jqtouch and jquery and phonegap.
What is the best way of doing that?


I have tested with this code but it doesnt do the trick, it still
loads the page 2 times!
function do_nothing() {
alert("do nothing");
return false;
}

// prevent a second click for 10 seconds. :)
$('.slide, .button').live('click', function(e) {
$(e.target).click(do_nothing);
setTimeout(function(){
$(e.target).unbind('click', do_nothing);
alert("the timeout");
}, 10000);
});

It is showing the both alerts but it the "return false; is not
preventing it from loading the page the second time!?

Any suggestions appreciated!

[Libby]

Perhaps an e.preventDefault() in there somewhere?

[Manmade]

Ok, I dont give up :-)
I have tested some new code to try to prevent double clicks.

In the index page I have at the top:
<script type="text/javascript">
var userAgent = navigator.userAgent.toLowerCase();
var isiPhone = (userAgent.indexOf('iphone') != -1 ||
userAgent.indexOf('ipod') != -1) ? true : false;
clickEvent = isiPhone ? 'tap' : 'click';
</script>


And in the onDeviceReady function I have:

$(this).bind(clickEvent, function(e) {
e.preventDefault();
alert('you just index this ' + clickEvent + 'ed me');
});

The alert is showed when I click my "Back" buttons to go back the the
previus page.
But not if I go to a new page?

And in the head I have:
$(document.body).ready(function(){

$('.fade').bind(clickEvent, function(e) {
e.preventDefault();
alert('you just fade ' + clickEvent + 'ed me');
});
});

The thing is that the fade alert is only working when I click a link
in the index file, not if I click a link with the class fade in any of
my subpages(I get all my pages as ajax pages).

What Im I missing?
Any input appreciated.
Thanks!

[Libby]

Hi Man.

I am not familiar with jqtouch.. But with jQuery Mobile the "new way" is

to not use $(document).ready() but pageinit event on each page instead..

And how do the subpages get their javascript? Each page includes same

javascript?

HTH,

Libby

[jcesar]

you have the .one function in jquery

$("#foo").one("click", function() {
alert("This will be displayed only once.");
});

equivalent to

$("#foo").bind("click", function( event ) {
alert("This will be displayed only once.");
$(this).unbind( event );
});

[Manmade]

Hi guys and thanks.
Libby: So how would you bind something to every subpage with pageinit?
What would it look like? Is that only supported in jquery mobile or is
it supported in the ordinary jquery aswell?

I have looked at jquery mobile and thinking of starting with that
instead of jqtouch, if I have other scripts today that needs jquery,
do you think that I then need both jquery and jquery mobile to make it
work?
I know its hard to say, but whats you guess?

jcesar: one seams the way to go, is that only supported in the latest
jquery?

Ill have to test it, thanks!

[Libby]

Well, I suppose some of these decisions have a lot to do with how

your app is designed at a high level, like the need for multiple pages, etc. 

jQuery Mobile: requires jquery-1.6.4.js, so all jquery (core)

functionality is available. Not sure from your questions if you

know this.

Not familiar with jQTouch, but you might be interested in

jQuery 1.7 .on()  (docs imply only ready at 1.7, so not 1.6.4 ??)

vs. jQuery .live() (docs state will/is deprecated in 1.7 ?!)

for event handling attachment by element class. Lots of docs

on jQuery and jQM..

Libby