Prevent browser pop on taphold event

In a jquery-mobile based web app, how do i prevent the default browser menu from showing on "tap hold" .. instead i want to show a custom dialog page ..

mentioned below is 开发者_JS百科my code as of now ..

$(".task_row").bind('taphold',function(event, ui){
    event.preventDefault();
    $("#slide_down_menu").trigger('click');
});

use css:

a {
    -webkit-touch-callout: none !important; 
}

to not show the standard dialog

The trouble is that the 'taphold' event that you are binding to is a custom event that is triggered by jQuery Mobile, so it is not the same event that triggers the browser's default behavior.

If the default menu you are trying to avoid is the one that allows you to "Open" or "Copy" the url, then one solution is to not use an <a> tag. If you use a span or a div, you can bind an ontap function to it that will change the browser's location, and your taphold event will not be interrupted with the default behavior.

I found out you have to disable right-clicking.

$(function(){

    document.oncontextmenu = function() {return false;};

    $(document).mousedown(function(e){

        if ( e.button == 2 )
        { 
            alert('Right mouse button!'); 
            return false; 
        }

        return true;
    });
});

What about using the ontouchstart event? I'm pretty sure I've used this to prevent the default iPad interactions from occuring.

$(".task_row").bind('touchstart', function(event, ui){
    event.preventDefault();
    $("#slide_down_menu").trigger('click');
});

You were pretty close with it. The correct code is:

$('#ciytList li a ').bind('taphold', function(e) {
    e.preventDefault();
    return false;
} );

I just took off the link and applied css to make it look like one and used this

$.mobile.changePage( "#main", { transition: "slideup"} );

but i already had it bound to a click event that shows a delete button... no more popup menu