jQuery and jQuery Mobile : tap vs touchstart, touchend, touchmove and click?

后端 未结 2 422
不思量自难忘°
不思量自难忘° 2021-01-24 03:51

Does the jQuery Mobile Tap corresponds to adding an event listener to an element like this:

myElement.addEventListener(\"touchstart\", touchStartHandler, false)         


        
相关标签:
2条回答
  • 2021-01-24 04:35

    Internally tap makes use of vclick.

    If you don't find an event in this list, they aren't exposed with the same name: https://api.jquerymobile.com/category/events/

    This means, for example: if you need to handle touchstart, touchend and touchmove, as normally is, you will probably end up to use the set of virtualized mouse event handler: vmousedown, vmousemove, vmouseup and vclick but you may need to handle the status of the pointer (mouse or finger) by yourself. Do not forget to handle vmousecancel.

    Moreover, you should note that there is a delay to wait for some events.

    Following is a short extract for you, from the jQuery Mobile documentation with some critical concepts for touch devices (mobile or modern hybrid laptops) to pay attention to:

    Webkit based browsers synthesize mousedown, mouseup, and click events roughly 300ms after the touchend event is dispatched.

    The jQuery Mobile taphold triggers after 750ms.

    After 1500ms, then it is not a touch event. Scroll, TouchMove and TouchEnd events use this. The block list is cleared.

    We recommend using click instead of vclick anytime the action being triggered has the possibility of changing the content underneath the point that was touched on screen. This includes page transitions and other behaviors such as collapse/expand that could result in the screen shifting or content being completely replaced.

    Have a nice day

    0 讨论(0)
  • 2021-01-24 04:37

    I dont know if is exactly the same way they do the handle, but both of they wait for an action and then execute funciton. in jquery mobile you can do

    $("p").on("taphold",function(){
    $(this).hide();
    });

    and

    $(function(){
    $( "div.box" ).bind( "tap", tapHandler );

    function tapHandler( event ){
    $( event.target ).addClass( "tap" );
    }
    });

    list of events https://api.jquerymobile.com/category/events/

    0 讨论(0)
提交回复
热议问题