Replace all click events by clicking on jQuery mobile to speed up

I am developing a mobile application using phonegap and jquery mobile. I created a layout with data roles, etc .... and in this application I have many buttons, as shown below, to go to different pages. (I specifically don’t attach click events to these buttons, they just use href for magic).

<a data-role="button" href="#page6">
    go to page 6
</a>

The problem with these buttons is that they are incredibly slow, with a delay of 400 ms, which everyone is talking about. Is it possible to replace all events on these buttons with the / vclick / touchstart key (whatever it is) so that they respond instantly? They will never have to deal with double taps or people who shoot ...

thank

+5
source share
5 answers

I wrote a JS utility called Lightning Touch to get rid of this particular delay. Here I demonstrate this (badly).

The basis of this library is Google fastButtons, which apparently is no longer available (or, if it is, the URL has been changed), but is used to access the Creative Commons license from code.google.com.

Lightning Touch triggers concern touchhend, not touchstart, but I suspect that you can change it to work on touchstart without special efforts if it does not work as is for you.

Brian Leroux 400ms- ish delay, : "PPL " . , , Lightning Touch . , , .

, - . ( Lightning Touch , , .)

+13

: quojs .

( ). :

$$("#man").touch(function(){
    switchGender(true);
});

$$("#woman").touch(function(){
    switchGender(false);
});

$$(".next").touch(function(){
    nextPage();
});
+3

:

$("a").on("tap",function(e){
                         $(this).trigger("click");
                         e.preventDefault();
                         return false;
                         });

$(document).on("ready",function(){

!

+2

$.fn.addTouch = function() {
    if ($.support.touch) {
            this.each(function(i,el){
                    el.addEventListener("touchstart", iPadTouchHandler, false);
                    el.addEventListener("touchmove", iPadTouchHandler, false);
                    el.addEventListener("touchend", iPadTouchHandler, false);
                    el.addEventListener("touchcancel", iPadTouchHandler, false);
            });
    }
};

http://code.google.com/p/jquery-ui-for-ipad-and-iphone/

0
source

This script will check if the device is turned on, and then replace click events with events. It adds touch events to links and attribute attributes of onclick JavaScript. The script has been tested on Android, iPhone, iPad and Windows Phone.

//jQuery doc.ready
$(function () { 
    addTouchEvents();   
});

addTouchEvents = function() {
    var isTouchDevice = (('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch);

    if (isTouchDevice) {
        //replace link clicks with ontouchend events for more responsive UI
        $("a", "[onclick]").on("touchstart",function(e) {
            $(this).trigger("click");
            e.preventDefault();
            return false;
        });
    }
}
0
source

All Articles