在jQuery mobile中,tap和vclick之间的区别是什么?

lov*_*ing 15 javascript jquery html5 css3 jquery-mobile

我应该用哪个事件来听?为什么要使用vclick?我只是不知道使用哪种情况.

Gaj*_*res 43

如果jQuery Mobile Tap过去只能在移动设备上使用.不再是这种情况了.

创建VClick是为了弥补桌面/移动设备之间点击/点击不兼容之间的差距.

现在你可以自由使用水龙头,但问题很少.点击将在iOS平台上失败.应该使用Touchstart代替.

例子:

V单击

可以在桌面设备和移动设备上使用.

  • Android 4.1.1 - 没有延迟
  • iOS - 没有延迟
  • 桌面Firefox 19和Chrome 25.0.1364.152 - 没有延迟

http://jsfiddle.net/Gajotres/PYPXu/embedded/result/

$(document).on('pagebeforeshow', '#index', function(){       
    $( document ).on( "vclick", '[data-role="page"]', function() {
        $( this ).append( "<span style='color:#00F;'>vmouseup fired.</span>" );
    });
});
Run Code Online (Sandbox Code Playgroud)

点击:

龙头

它过去只能在移动设备上运行,现在也适用于桌面浏览器,但在使用jQuery Mobile 1.1及更低版本的iOS上会失败.

  • Android 4.1.1 - 没有延迟
  • iOS - 没有延迟
  • 桌面Firefox 19和Chrome 25.0.1364.152 - 没有延迟

http://jsfiddle.net/Gajotres/k8kSA/

$(document).on('pagebeforeshow', '#index', function(){       
    $( document ).on( "tap", '[data-role="page"]', function() {
        $( this ).append( "<span style='color:#00F;'>tap fired.</span>" );
    });
});
Run Code Online (Sandbox Code Playgroud)

点击

适用于移动设备和桌面浏览器.

  • Android 4.1.1 - 可见延迟(300+ ms)
  • iOS - 没有延迟
  • 桌面Firefox 19和Chrome 25.0.1364.152 - 没有延迟

http://jsfiddle.net/Gajotres/L2FHp/

$(document).on('pagebeforeshow', '#index', function(){       
    $( document ).on( "click", '[data-role="page"]', function() {
        $( this ).append( "<span style='color:#00F;'>click fired.</span>" );
    });
});
Run Code Online (Sandbox Code Playgroud)

结论

如果你想有一个向后的兼容性JQM坚持使用V单击,在任何其他情况下使用自来水.