Continue loading when pressing 'esc' key in browser - javascript

Pressing esc in most browsers stops the request. However I want to override this and continue the request.
I have tried the following but no success.
$(document).on("keyup", function(e) {
if (e.keyCode == 27) { // escape key maps to keycode `27`
e.preventDefault();
}
});
Is this possible to achieve?

try this one
document.attachEvent("onkeydown", keydown);
function keydown() {
// esc
if (event.keyCode = 27) {
event.returnValue = false;
event.keyCode = 0;
}
}

Related

Capture keyDown for current page only

I have forms on different pages of my applications. Upon pressing 'Enter' or 'Esc', the form on the current page must be 'Submitted' or 'Cancelled'. The keydown() function should be triggered anywhere on the page and not tied to a specific DOM element.
.js
$(document).keydown(function(e) {
if(e.which == 13) {
// enter pressed
$('#submitCreateAccountForm').click();
$('#submitForm').click();
$('#submitNewSubmissionForm').click();
}
if(e.which == 27) {
// esc pressed
$('#submitCreateAccountFormCancel').click();
$('#submitFormCancel').click();
$('#submitNewSubmissionFormCancel').click();
}
});
What should 'document' be replaced by? Thanks
try this
$(function(){
$('html').bind('keypress', function (e) {
if (e.keyCode == 13) {
//do somethings
}
else if (e.keyCode == 27) {
return false;
}
});
});
You can try this code:
$("body").keyup(function(event){ // bind keyup event to body
if(event.keyCode == 13){ // 13 - code of enter key (find for ESC)
$("#enter").click(); // bind enter press for clicking botton with id="enter" and corresponding actions
}
});

How to prevent user to press F5 ang CTRL+R in Mozila Firefox 24 using javascript or jquery

How to prevent user to press F5 and CTRL+R in Mozilla Firefox 24 using javascript or jquery.
You can't really prevent the user from reloading your page, but you can show up a message before leaving or reloading:
window.onbeforeunload = function(e) {
return 'Do You really want to leave the page?';
};
You can also set up an event handler for Ctrl or F5 keypress, and prevent defaults from happening, but it will not work for function keys (like Ctrl or F keys) in most browsers, for security reasons.
<script language="javascript" type="text/javascript">
//this code handles the F5/Ctrl+F5/Ctrl+R
document.onkeydown = checkKeycode
function checkKeycode(e) {
var keycode;
if (window.event)
keycode = window.event.keyCode;
else if (e)
keycode = e.which;
// Mozilla firefox
if ($.browser.mozilla) {
if (keycode == 116 ||(e.ctrlKey && keycode == 82)) {
if (e.preventDefault)
{
e.preventDefault();
e.stopPropagation();
}
}
}
// IE
else if ($.browser.msie) {
if (keycode == 116 || (window.event.ctrlKey && keycode == 82)) {
window.event.returnValue = false;
window.event.keyCode = 0;
window.status = "Refresh is disabled";
}
}
}
</script>

Disable a key press event through JavaScript

I need to disable shift keypress event in my site by using JavaScript or any other method.
Below is my code:
$(document).ready(function() {
document.onkeydown = checkKeycode
function checkKeycode(e) {
var keycode;
if (window.event) {
keycode = window.event.keyCode;
}
else if (e) {
keycode = e.which;
}
//alert(keycode);
if (keycode == 16) {
alert(keycode);
return false;
}
}
});
// bind an event listener to the keydown event on the window
window.addEventListener('keydown', function (event) {
// if the keyCode is 16 ( shift key was pressed )
if (event.keyCode === 16) {
// prevent default behaviour
event.preventDefault();
return false;
}
});
http://api.jquery.com/keypress/
In addition, modifier keys (such as Shift) trigger keydown events but not keypress events.
Try this
$('#target').keydown(function(event) {
if (event.shiftKey) {
event.preventDefault();
}
}
document.onkeydown = function (e) {
var e = e || event;
if (e.shiftKey === true) {
return false;
}
};
You may try this:
jQuery(document).keydown(function(e){
if(e.which === 16) {
e.preventDefault();
return;
}
console.log(e.which);
});
See demo.
Use Firebug and check console output.

Javascript: Escape key = browser back button

In a browser how can I make the keyboard's escape key go back in Javascript.
For example: if you visit this page and click the "Fullscreen" link I'd like to press the escape key and go back to the previous page.
What's the Javascript to make this magic happen?
You can add a Key-Listener:
window.addEventListener("keyup", function(e){ if(e.keyCode == 27) history.back(); }, false);
This will call history.back() if the Escape key (keycode 27) is pressed.
$(document).bind("keyup", null, function(event) {
if (event.keyCode == 27) { //handle escape key
//method to go back }
});
You can bind an onkeyup event handler to window and check if the keycode is 27 (keycode for Escape), then use the window.history.back() function.
window.onkeyup = function(e) {
if (e.keyCode == 27) window.history.back();
}
MDC docs on window.history, https://developer.mozilla.org/en/DOM/window.history
Just listen for key code 27 and call history.go(-1);
You need to listen for the 'ESC' keypress, and fire off the back action when it is pressed, like so:
document.onkeydown = function(e){
if (window.event.keyCode == 27) {
history.go(-1);
}
};

How to detect escape key press with pure JS or jQuery?

Possible Duplicate:
Which keycode for escape key with jQuery
How to detect escape key press in IE, Firefox and Chrome?
Below code works in IE and alerts 27, but in Firefox it alerts 0
$('body').keypress(function(e){
alert(e.which);
if(e.which == 27){
// Close my modal window
}
});
Note: keyCode is becoming deprecated, use key instead.
function keyPress (e) {
if(e.key === "Escape") {
// write your logic here.
}
}
Code Snippet:
var msg = document.getElementById('state-msg');
document.body.addEventListener('keypress', function(e) {
if (e.key == "Escape") {
msg.textContent += 'Escape pressed:'
}
});
Press ESC key <span id="state-msg"></span>
keyCode is becoming deprecated
It seems keydown and keyup work, even though keypress may not
$(document).keyup(function(e) {
if (e.key === "Escape") { // escape key maps to keycode `27`
// <DO YOUR WORK HERE>
}
});
Which keycode for escape key with jQuery
The keydown event will work fine for Escape and has the benefit of allowing you to use keyCode in all browsers. Also, you need to attach the listener to document rather than the body.
Update May 2016
keyCode is now in the process of being deprecated and most modern browsers offer the key property now, although you'll still need a fallback for decent browser support for now (at time of writing the current releases of Chrome and Safari don't support it).
Update September 2018
evt.key is now supported by all modern browsers.
document.onkeydown = function(evt) {
evt = evt || window.event;
var isEscape = false;
if ("key" in evt) {
isEscape = (evt.key === "Escape" || evt.key === "Esc");
} else {
isEscape = (evt.keyCode === 27);
}
if (isEscape) {
alert("Escape");
}
};
Click me then press the Escape key
Using JavaScript you can do check working jsfiddle
document.onkeydown = function(evt) {
evt = evt || window.event;
if (evt.keyCode == 27) {
alert('Esc key pressed.');
}
};
Using jQuery you can do check working jsfiddle
jQuery(document).on('keyup',function(evt) {
if (evt.keyCode == 27) {
alert('Esc key pressed.');
}
});
check for keyCode && which & keyup || keydown
$(document).keydown(function(e){
var code = e.keyCode || e.which;
alert(code);
});
Pure JS
you can attach a listener to keyUp event for the document.
Also, if you want to make sure, any other key is not pressed along with Esc key, you can use values of ctrlKey, altKey, and shifkey.
document.addEventListener('keydown', (event) => {
if (event.key === 'Escape') {
//if esc key was not pressed in combination with ctrl or alt or shift
const isNotCombinedKey = !(event.ctrlKey || event.altKey || event.shiftKey);
if (isNotCombinedKey) {
console.log('Escape key was pressed with out any group keys')
}
}
});
pure JS (no JQuery)
document.addEventListener('keydown', function(e) {
if(e.keyCode == 27){
//add your code here
}
});
Below is the code that not only disables the ESC key but also checks the condition where it is pressed and depending on the situation, it will do the action or not.
In this example,
e.preventDefault();
will disable the ESC key-press action.
You may do anything like to hide a div with this:
document.getElementById('myDivId').style.display = 'none';
Where the ESC key pressed is also taken into consideration:
(e.target.nodeName=='BODY')
You may remove this if condition part if you like to apply to this to all. Or you may target INPUT here to only apply this action when the cursor is in input box.
window.addEventListener('keydown', function(e){
if((e.key=='Escape'||e.key=='Esc'||e.keyCode==27) && (e.target.nodeName=='BODY')){
e.preventDefault();
return false;
}
}, true);
Best way is to make function for this
FUNCTION:
$.fn.escape = function (callback) {
return this.each(function () {
$(document).on("keydown", this, function (e) {
var keycode = ((typeof e.keyCode !='undefined' && e.keyCode) ? e.keyCode : e.which);
if (keycode === 27) {
callback.call(this, e);
};
});
});
};
EXAMPLE:
$("#my-div").escape(function () {
alert('Escape!');
})
On Firefox 78 use this ("keypress" doesn't work for Escape key):
function keyPress (e)(){
if (e.key == "Escape"){
//do something here
}
document.addEventListener("keyup", keyPress);
i think the simplest way is vanilla javascript:
document.onkeyup = function(event) {
if (event.keyCode === 27){
//do something here
}
}
Updated: Changed key => keyCode

Categories

Resources