Develop Reference

javascript prevent middle mouse button from opening link in new tab

On some websites, you can right-click on a link and chose "open in a new tab" and it works fine, but not if one uses the middle mouse button to do so.
I encountered this a few times, it's it not too annoying but I'm still curious what causes this behaviour. (About the HOW)
Here is a site that behaves this way browsing with Chrome 46:
http://ebookfriendly.com/free-public-domain-books-sources/
the html link tags looks normal:
<a title="Feedbooks" href="http://www.feedbooks.com/">⇢ Feedbooks</a>
The cause must be something in the javascript. Any pointers?

One way to do this is using the auxclick event. (auxclick on MDN)
The following code will prevent the middle click behaviour on the entire page.
window.addEventListener("auxclick", (event) => {
if (event.button === 1) event.preventDefault();
});

Seems like this link has an event listener that uses preventDefault() and opens the page by other means.
Edit: hard to say why exactly they do this but when I look at the whole handler it seems that the link is being passed to google analytics:
function(e) {
var n = this.getAttribute("href"),
i = "string" == typeof this.getAttribute("target") ? this.getAttribute("target") : "";
ga("send", "event", "outbound", "click", n, {
hitCallback: t(n, i)
}, {
nonInteraction: 1
}), e.preventDefault()
}

You can ask which button caused the event and prevent the default behavior.
document.querySelector("a").addEventListener("click", function(e) {
if (e.which === 2) {
e.preventDefault();
}
}, false);

$(document).mousedown(function(e){
if(e.which == 2 ){
e.preventDefault();
alert("middle click");
return false;
}
});
works only if you keep the alert()

prevent OnBeforeUnload() event from happening in refresh/F5

I'm using onbeforeunload event to perform operations during the closing page.
I do not want the event to happen in the case of Refresh / F5.
Is there a way or other event to do this?

Unfortunately onbeforeunload event listens the page state in the browser. Going to another page as well as refreshing will change the page state, meaning onbeforeunload will be triggered anyway.
So I think it is not possible to catch only refresh.
But, if you'll listen and prevent Keypress via JavaScript, then it can be achieved.
Refresh can be done via F5 and CtrlR keys, so your goal will be to prevent these actions.
using jQuery .keydown() you can detect these keycodes:
For CtrlR
$(document).keydown(function (e) {
if (e.keyCode == 65 && e.ctrlKey) {
e.preventDefault();
}
});
For F5
$(document).keydown(function (e) {
if (e.which || e.keyCode) == 116) {
e.preventDefault();
}
});

I would use the keydown listener to check for F5 and set a flag var.
http://api.jquery.com/keydown/
Detecting refresh with browser button is not that easy/possible.

I wanted to add a message alert onbeforeunload, so my solution was this one:
$(document).ready(function(){
window.onbeforeunload = PopIt;
$("a").click(function(){ window.onbeforeunload = UnPopIt; });
$(document).keydown(function(e){
if ((e.keyCode == 82 && e.ctrlKey) || (e.keyCode == 116)) {
window.onbeforeunload = UnPopIt;
}
});
});
function PopIt() { return "My message before leaving"; }
function UnPopIt() { /* nothing to return */ }
Third line ($("a").click...) is to avoid showing the alert when navigating between sections of the web.

Trigger an event on click within body area

I need to trigger the click, on click on my webpage. I tried the below and it triggers the click onload and not on click.
$(function() {
$("body").click(function(e) {
alert("code");
})
$('#container').trigger('click');
});
Basically I need to show a popup on click of P keyword from keyboard. While I started I got stuck during the initial stages. Not sure how to achieve this.

I guess you need a keydown event where P key passes ASCII code 80:
$("body").on("keydown", function(e) {
if (e.which === 80) {
alert("'p' was pressed");
}
});

jQuery Focus() or keypress() not working in IE and Chrome

I have the code blow for tabbing through 2 fields and it has no effect in IE and Chrome, it seems it runs nothing (for example I get nothing when I put alert) and in Firefox it runs with some bug (it jumps twice there) where do you think the problem is, I'm developing in by ASP.Net and jQuery version 1.3.2
$(document).ready(function () {
$("#TextBox1").keypress(function (e) {
var kCode = e.keyCode || e.charCode;
if (kCode == 9) {
$("#TextBox2").focus();
}
});
});

I think the main problem is that you're using the keypress event, which should only be fired when a character is added to the input, not when any key (like TAB) is pressed.
To handle other key presses you will need to use keydown. However, testing that in your fiddle seems to still not work. To make it work (in Chrome at least), I had to prevent the default action:
$(document).ready(function () {
$("#TextBox1").keydown(function (e) {
e.preventDefault();
var kCode = e.keyCode || e.charCode;
console.log(kCode);
if (kCode == 9) {
$("#TextBox2").focus();
}
});
});
Here's an update fiddle. However, if I've understood your question correctly, all you're trying to do is change the focused element when the tab key is pressed... if that's right, why not just use the tabindex attribute instead?

The keypress event does not fire for tab (keycode 9). You'll need to use keyup or keydown.

If this is ASP.NET, you need to reference the controls by the ClientID:
$(document).ready(function () {
$("#<%=TextBox1.ClientID%>").keypress(function (e) {
var kCode = e.keyCode || e.charCode;
if (kCode == 9) {
$("#<%=TextBox2.ClientID%>").focus();
}
});
});

Esc key not getting recognized in Firefox

For some reason this script isn't working in Firefox:
document.onkeydown=function keypress(e) {
if (e.keyCode == 27) {
window.location = "/edit"
};
};
It works fine in Chrome, but for some reason it's not working in Firefox.
Basically, what it does is load the /edit page when you press the escape key.

use:
document.onkeydown=function keypress(e) {
e=(e||window.event);
if (e.keyCode == 27) {
try{e.preventDefault();}//Non-IE
catch(x){e.returnValue=false;}//IE
window.location = "/edit";
};
}
The default-action for ESC is to stop loading the page,
so you must prevent from this behaviour, otherwise you cannot change the location.
Fiddle: http://jsfiddle.net/doktormolle/CsqgE/ (Click into the result-frame first before using ESC)
But however, you really should use another key.
A user expects that the loading of the current page stops if he uses ESC , nothing else.

The event handler is working for me: http://jsfiddle.net/Tm2PZ/
I suspect the lcoation you're setting is not valid.
Try setting window.location.href instead.

if you don't use 'Escape keyup or Escape keydown' for other things in your code, you can use 'keyup' to replace keypress**
document.body.addEventListener( 'keyup', function (e) {
e=(e||window.event);
if (e.key == "Escape") {
console.log('escape is pressed');
}
},false );
e.keyCode is depreciate, use e.key, add "console.log(e.key)" in your listener if you want to get key name
it is better, because it adapts to the keyboard which does not have the same composition and e.keyCode does not adapt