Why does return false work with alert but not console.log

Question

I have a problem. With this html:

<div id="d"><div>Click me!</div><div>Or me</div></div>

When I use this code:

$("#d").on("mousedown", "div", function (e){
    console.log('clicked');
    if (e.which == 3) alert('left button clicked');
    return false;
});

It prevents the context menu from showing and alerts, but when I use this code:

$("#d").on("mousedown", "div", function (e){
    console.log('clicked');
    if (e.which == 3) console.log('left button clicked');
    return false;
});

It logs to the console, but doesn't prevent the context menu. I'm confused.

Here's a JSFiddle demonstrating the problem.

Oh, and please be patient if you happen to find a duplicate or something. I did try to find it.

@SLaks - I just realized that. Fixed. Darn jsfiddle using old versions. — PitaJ, Feb 19 '14 at 01:04

score 4 · Answer 1 · answered Feb 19 '14 at 01:06

4

You're not preventing the context menu with the first code. SOme browsers just don't open it anymore because of the alertwindow getting the focus. It's not the return false that prevents the menu, it's the alert itself.

answered Feb 19 '14 at 01:06

Johannes H.

5,875
1
20
40

score 3 · Accepted Answer · edited May 23 '17 at 12:28

3

I added an updated fiddle: http://jsfiddle.net/2D32L/12/

$("#f").on("contextmenu", "div", function (e) {
    e.preventDefault();
});

See this question for more information.

For the rest I agree with Johannes H.; it's not the return value that cancels the contextmenu, it's the alert that does.

edited May 23 '17 at 12:28

Community

1
1

answered Feb 19 '14 at 01:10

RobIII

8,488
2
43
93

So neither one should be working? Why don't they work? – PitaJ Feb 19 '14 at 01:26
Neither **which**? If you're referring to OP's examples: the first uses an `alert` which causes the browser to cancel the contextmenu because the alertbox and contextmenu would otherwise conflict. The second uses a `console.log` which **doesn't** cause the browser to cancel the contextmenu since that is the only UI element. So I'm not sure what you're asking? My code works because it explicitly listens for the `contextmenu` event (which is fired just before opening the contextmenu) and [explicitly cancelling the event](http://riii.nl/vncvq) (in effect canceling the contextmenu to show up). – RobIII Feb 19 '14 at 01:28
I am OP and I'm wondering why my code doesn't work in the first place. Aka why the return false doesn't prevent the context menu – PitaJ Feb 19 '14 at 01:33
Ah, missed the fact that were the OP :) My bad. It has nothing to do with returning `false` (or any other value for that matter). It's the `alert` box **and** the `contextmenu` conflicting in the 1st example, forcing the browser to choose one or the other resulting in an alertbox showing and the contextmenu being cancelled since the browser would otherwise be forced to "pop up" 2 UI elements simultaneously (causing confusion for the user). So the contextmenu is cancelled. The 2nd example doesn't have this problem (the `console` doesn't "interfere" UI-wise) so the contextmenu can be shown fine. – RobIII Feb 19 '14 at 01:36
Yes I understand that. I'm wondering why the return false doesn't prevent the connect menu. – PitaJ Feb 19 '14 at 01:40
Because it doesn't. I don't know what else you want me to say. Returning `false` or `"foobar"` or `"CLOSE_MENU"` or `42` or `null` or anything else doesn't matter. It's just not the way it works. You need to call the actual event's (`e` in this case, could've been `q` just as well) [`preventDefault()`](https://developer.mozilla.org/en-US/docs/Web/API/event.preventDefault) method. As you can see, my code returns nothing; in fact: it doesn't even have a `return` statement. – RobIII Feb 19 '14 at 01:43
Okay, so the `mousedown` event, unlike `click`, doesn't respond to a false return. – PitaJ Feb 19 '14 at 01:56
Well, actually, it's been a while since I've done client-side and/or javascript/jQuery coding so I don't know if anything has changed in later versions of jQuery or something but you might want to read [this post](http://fuelyourcoding.com/jquery-events-stop-misusing-return-false/). I have even seen [a post](http://stackoverflow.com/a/706728/215042) or two stating that the '`contextmenu`-event' doesn't even exist; clearly it does now(adays). – RobIII Feb 19 '14 at 02:06

Why does return false work with alert but not console.log

2 Answers2