5

Im developing a mobile application using phonegap and jquery mobile. I created the layout with data-roles etc... and in this application I have a lot of buttons like the following to go to different pages. (I don't specifically bind click events to these buttons, they just use the href for the magic).

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

The problem with these buttons is that they are incredibly slow, with the 400ms delay every1 is talking about. Is it possible to replace all events on these buttons with tap/vclick/touchstart (Whatever is best) so they respond instant? They will never have to deal with double taps or people dragreleasing...

Thanks

4

5 回答 5

13

我编写了一个名为 Lightning Touch 的 JS 实用程序来消除这种延迟。 这是我展示它(糟糕)。

该库的基础是 Google 的 fastButtons,它显然不再可用(或者如果它是,URL 已更改),但曾经在 code.google.com 的 Creative Commons 许可下可用。

Lightning Touch 在 touchend 而不是 touchstart 上触发,但我怀疑你可以修改它以在 touchstart 上工作而无需太多努力,如果它不适合你。

在一次演示中,Brian Leroux一张关于 400 毫秒延迟问题的幻灯片,上面写着“PPL 已经解决了这个问题”。 如果 Lightning Touch 不适合您的情况,他会链接到一些您可能会查看的项目。如果这些都失败了,您可以尝试查看他在同一个演示文稿中链接到的另一个列表

希望那里有适合您的解决方案。(如果 Lightning Touch 不起作用,我很想知道确切原因,以便改进它。)

于 2012-05-06T17:09:18.160 回答
3

试试这个库:quojs它对我来说非常有用。

这是一个例子(触摸功能非常快)我在这里切换类:

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

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

$$(".next").touch(function(){
    nextPage();
});
于 2012-12-29T13:55:35.217 回答
2

这个小代码应该会有所帮助:

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

把它放入

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

瞧!

于 2013-10-29T10:36:58.987 回答
0

此脚本将测试设备是否启用了触摸,然后将点击事件替换为 touchend 事件。它将触摸事件添加到链接和 JavaScript onclick 元素属性。脚本已在 Android、iPhone、iPad 和 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;
        });
    }
}
于 2014-05-06T17:30:39.563 回答
0

这个插件会有很大帮助

$.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/

于 2012-04-05T14:12:00.877 回答