event.preventDefault() not stopping mailto links w/ gmail

Question

I have a jQuery function with even.preventDefault() applied to a click on any element with the class 'editable'.

It's not preventing gmail from opening up it sweb interface to send an email, however. It works on systems where default mail behaviour is not set up (the one I was primarily testing on).. not sure about when it's run through Outlook or an actual mail application.

Is there some workaround for this?

$('.editable').not('video, img, textarea').click(function(event) { 
        event.preventDefault();
        loadEditor($(this));
    });

edit: I have also tried with event.stopPropagation(); but it is still going through.

If the problem is with mailto links, can you just remove the href attribute? — Douglas, Aug 28 '11 at 03:55
not eeeasily.. i'm grabbing the value of the href to edit the link properties (this is a jquery editor that uses the same source code from the page situation). i could remove the href and put it somewhere else, but that would take a fair bit of rejigging — Damon, Aug 28 '11 at 03:56
actually removing just the 'mailto:' will work.. it has basically the same information. `$('a[href^="mailto:"]').each(function(){ this.href = this.href.replace("mailto:",""); });` — Damon, Aug 28 '11 at 05:18

score 1 · Answer 1 · edited May 23 '17 at 12:04

1

try adding return false,

$('.editable').not('video, img, textarea').click(function(event) { 
        event.preventDefault();
        loadEditor($(this));
        return false;
    });

event.preventDefault() vs. return false

edited May 23 '17 at 12:04

Community

1
1

answered Aug 28 '11 at 03:31

Jayantha Lal Sirisena

21,216
11
71
92

2

Worth explaining that `return false` has the effect of *also* doing `event.stopPropagation();` – Yahel Aug 28 '11 at 03:37

score 1 · Answer 2 · answered Aug 28 '11 at 03:32

1

The gmail interface event handling is probably happening in-browser, so try calling event.stopPropagation too.

answered Aug 28 '11 at 03:32

Douglas

36,802
9
76
89

score 0 · Answer 3 · answered Feb 11 '14 at 16:57

For those of you who are still having problems figuring out why there is no effect whatsoever on the submit link button that also link to mailto, I think the problem is the Mailto: for Gmail extension for Chrome. The link works fine in Firefox. And the link works fine once the aforementioned extension is disabled in Chrome.

score 0 · Answer 4 · answered Aug 28 '11 at 03:43

event.preventDefault() works for elements which have default behavior associated to them.

E.g. anchor elements redirect to url set in the href, form submit event submits the form. For such cases event.preventDefault() will stop its behavior.

The issue which you are facing is event bubling, you should use event.stopPropagation() along with (event.preventDefault() or return false).

 $('.editable').not('video, img, textarea').click(function(event) { 
        event.stopPropagation();
        loadEditor($(this));
        return false;
    });

score 0 · Accepted Answer · answered Sep 14 '11 at 15:23

I'm not sure if there is actually a way to prevent this, none of the event related jQuery commands mentioned in other answers were effective.

For the meantime, I'm removing the 'mailto' part of the link when editing is enabled and it does the job just fine.

event.preventDefault() not stopping mailto links w/ gmail

5 Answers5