I have an image gallery with various controls. One of the controls is a basic delete function, to delete you click and hold for approx 1 second to get a confirmation asking if you want to delete. All works fine, it's just that on mobile devices it often causes the "Save Image As, etc" menu to pop up which has to be closed before the intended action can be performed.

I've read about various fixes but none of them seem to work with current versions of Chrome mobile on my Galaxy S5, and the most recent answer I could find was from 2013.

I found one saying that the context menu was it's own function, so I tried something like this:

    window.oncontextmenu = function(event) {
        event.preventDefault();
        event.stopPropagation();
        return false;
    };

But it did not prevent the context menu from showing on my S5. As I said, I'm hoping to find a solution to prevent it from ing up on certain items, not the entire window.

Thanks to Tasos for the answer

document.getElementById('yourElement').oncontextmenu = function(event) {
    event.preventDefault();
    event.stopPropagation(); // not necessary in my case, could leave in case stopImmediateProp isn't available? 
    event.stopImmediatePropagation();
    return false;
};

I have an image gallery with various controls. One of the controls is a basic delete function, to delete you click and hold for approx 1 second to get a confirmation asking if you want to delete. All works fine, it's just that on mobile devices it often causes the "Save Image As, etc" menu to pop up which has to be closed before the intended action can be performed.

I've read about various fixes but none of them seem to work with current versions of Chrome mobile on my Galaxy S5, and the most recent answer I could find was from 2013.

I found one saying that the context menu was it's own function, so I tried something like this:

    window.oncontextmenu = function(event) {
        event.preventDefault();
        event.stopPropagation();
        return false;
    };

But it did not prevent the context menu from showing on my S5. As I said, I'm hoping to find a solution to prevent it from ing up on certain items, not the entire window.

Thanks to Tasos for the answer

document.getElementById('yourElement').oncontextmenu = function(event) {
    event.preventDefault();
    event.stopPropagation(); // not necessary in my case, could leave in case stopImmediateProp isn't available? 
    event.stopImmediatePropagation();
    return false;
};

• javascript
• android
• jquery
• html
• css

Share Improve this question Follow edited Apr 16, 2016 at 22:12 SISYN asked Apr 16, 2016 at 18:38 SISYNSISYN 2,26955 gold badges2626 silver badges4646 bronze badges 3

• Have you added this CSS -webkit-user-select: none; to disable text selection on long press. I think you are not facing this problem – rajesh Commented Apr 16, 2016 at 18:52
• 1 theres also (event.stopImmediatePropagation();) -- try putting that underneath (event.stopPropagation();) -- otherwise check here stackoverflow./questions/12304012/… – Tasos Commented Apr 16, 2016 at 18:53
• 2 The CSS property does not work either. Tasos, please post an answer with your stopImmediateProp solution because it worked and I would like to give you credit. Will be updating the original question as well. Thanks! – SISYN Commented Apr 16, 2016 at 22:10

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

I (re)post the answer here because at first, I haven't seen it was in the question :)

So juste use this code, with stopImmediatePropagation :

document.getElementById('yourElement').oncontextmenu = function(event) {
    event.preventDefault();
    event.stopPropagation(); // not necessary in my case, could leave in case stopImmediateProp isn't available? 
    event.stopImmediatePropagation();
    return false;
};