Catch save (Ctrl/Cmd+S) keyboard shortcut in the browser? - javascript

Is there a cross-browser way or cross browser solution to capture the "Save" keyboard shortcut in the browser? For example, in GMail if you use CMD + S it will save the email and not prompt the browser to download the webpage (default behavior). I would rather use a cross browser solution than add event listeners and write it from scratch.

One cross browser solution is to check out keycode.js. Less hassle to worry about looking for browser caveats and such.
I know it's old, but it still works. You can check out its demo too!
Looking at the demo, and the header comments in the .js, something like this?
document.onkeydown = function(e) {
e = e || window.event
var k = KeyCode.translate_event(e);
if( k.ctrl && !k.alt && !k.shift && k.code == 83 ) //83 is the code for s
save(); //Magic function
if(e.preventDefault) {
e.preventDefault();
}
return false;
};

Related

window.clipboardData.setData('text','') is not working in chrome

i want to prevent print screen in my website.
i used
but its not working in chrome and mozillafirefox
$(document).keyup(function(e){
if(!e) e = window.event;
var keyCode = e.which || e.keyCode;
if (keyCode == 44) {
if(window.clipboardData) {
window.clipboardData.setData('text', '');
}
}
});
Thank you
There are keystrokes you can't capture on many operating system/browser combinations. PrintScreen is very, very likely to be one of them.
You just can't do this. If your site can be displayed in a browser, screenshots can be taken of it (also copies of it can be stored locally and manipulated, the content can be scraped via non-browser technologies, etc., etc.).

Disable ALT+F4, yes I know it isn't recommended

I need a JavaScript script that would disable users from closing using ALT+F4. I have looked everywhere but it just everyone just says it isn't advised.
May not even be possible, if it isn't I will just have to detect when the user does quit out this way and log it in a database.
Here is my current script, it detects if the user presses either ALT or F4, but I can't get it to cancel that key press. Is there a way to make the browser think the user pressed another key as well so the combo would be ALT + G + F4 for example, which would disrupt the ALT+F4 combo?
//Run on keydown, disable user from quiting via ALT+F4
document.onkeydown = function(evt) {
evt = evt || window.event;
//Get key unicode
var unicode = evt.keyCode ? evt.keyCode : evt.charCode;
//Check it it's ALT or F4 (115)
if (unicode == 115 || evt.altKey == 1)
{
window.event.cancelBubble = true;
window.event.returnValue = false;
}
};
That key event is (on most OSs I guess) processed by the OS before it'S even sent to the browser, so cancelling the event inside the browser won't help a thing - even if it was Javascript that is executed inside the browser's UI, not only the current document.
Therefore - what you're trying to do cannot be done.
One can prevent the resulting window closure with:
window.onbeforeunload = funcRef
I think readers landing here might want to be reminded of this (as I did).
For related details, see
Jquery prevent window closing
try to use the code below:
window.webContents.on("before-input-event",(event,input)=>{
if(input.code=='F4'&&input.alt)event.preventDefault();});

How to Disable Function keys using Javascript?

I'm having a page where i need to disable the Function keys mainly F12(Developertools).
I'm showing some sensitive data in the page so at any case i cannot make the users see the html and take the hidden fields.
I checked some javascript which is working for almost all the keys except the Function keys like f1, f12 etc.
Is there anyway that i can disable these buttons in the browser?
document.onkeyup = KeyCheck;
function KeyCheck() {
var KeyID = event.keyCode;
alert(KeyID);
switch (KeyID) {
case 123: //F12 KEY CODE
alert('hello');
return false;
break;
}
}
This is the code which im using for overriding the key. When I searched, the keycode of F12 key is 123 and im using the same code for overriding it. But unfortunately its not even hitting the "CASE" and the message box is not appearing when pressing F12, F1 etc buttons.
Please Help me in this.
There is no reliable way to prevent users from tampering with your javascript data, when you've sent it. Always use server-side checks to verify the returned data.
People can still use the browser's menu to enable the dev console. Or through right-click --> "Inspect Element", or by using hotkeys to open different sections of the console, then tabbing to another page in the console, or by using one of the hotkeys I've failed to mention.
Or, they can simply disable javascript. (Or edit the javascript to disable the block)
Now, you can be a little more thorough in disabling whatever button's functionality, by adding a:
event.preventDefault() in your event listener, but still, it's unreliable.
document.onkeydown = KeyCheck;
It worked.
No, you can't diasble view source/developer tools or any other application level functionality of the browser via JavaScript on the page.
There are plenty ways to see source of the web page. You are up to very hard task to restrict all external parties to access/store/view your HTML. Here is partial list of other things you'll have to disable:
proxies, including HTTP debuggers/proxies like Fiddler or ones that are built in to browsers.
direct GET requests from console tools like curl.
all sorts of web crawlers, including search engines like Google.
Use HTTPS and do not send sensetive information unless strictly required is the much easier way of protecting it than trying to limit what users can do with their machines.
Try this out:
<script language="JavaScript">
document.onkeypress = function (event) {
event = (event || window.event);
if (event.keyCode == 123) {
//alert('No F-12');
return false;
}
}
document.onmousedown = function (event) {
event = (event || window.event);
if (event.keyCode == 123) {
//alert('No F-keys');
return false;
}
}
document.onkeydown = function (event) {
event = (event || window.event);
if (event.keyCode == 123) {
//alert('No F-keys');
return false;
}
}
</script>
This Code works Perfectly for me to Disable Right Click and Disable F12
<script language=JavaScript>
var message="You Have No Permission";
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function("alert(message);return false")
When user press F12 key, browsers developer tool bar will open in the below portion of the browser.
By using the developer tool bar user can see the design, javascript code and corresponding css applied to the controls in the page. To prevent the user to do that we will hide the developer tool bar.
Here is the code

Disable backspace with DOM Level 3 Listeners

I am making a page in which a user must be able to type. The default function of backspace is to go back a page, however I need to prevent this and assign my own function to it.
The problem is actually preventing backspace. I can capture it however I can not prevent it.
I am using Level 3 event listeners. event.preventDefault() did not work for me and neither did return false.
I have tried this also:
function onunload(e) {
if (e.keyCode == 37) return false;
return true;
}
and
<body onunload="return false;">
However the first basically does
return confirm("false");
and the second does nothing?
Preventing backspace key altogether might not be a good idea, assume you make a typo and want to fix it in a text box! So you need to disable backspace only if someone is not typing in a text input!
This might work in all major browsers:
document.onkeydown = function (e) {
e = e || window.event;
if (e.keyCode == 8) { // Disable Backspace
var el = document.activeElement;
if (!((el.nodeName == "INPUT" && (el.type == "text" || el.type == "password")) || el.nodeName == "TEXTAREA")) {
e.preventDefault();
e.stopPropagation();
return false;
}
}
};
DOM3 event model spec comes with backward compatibility so I don't think this might be an issue, however this is the DOM3 modified version of the above code:
function KeyDownHandler(e) {
if (e.keyCode == 8) { // Disable Backspace
var el = document.activeElement;
if (!((el.nodeName == "INPUT" && (el.type == "text" || el.type == "password")) || el.nodeName == "TEXTAREA")) {
e.preventDefault();
e.stopPropagation();
}
}
};
if (document.attachEvent) document.attachEvent("onkeydown", KeyDownHandler);
else document.addEventListener("keydown", KeyDownHandler);
A DOM3 event registration like the one above might be a great pain, John Resig has a good implementation on this, you could however use a standard cross browser library like JQuery which works fine in all major browsers!
AFAIR, one may prevent default browser shortcut actions by returning false in keypress in Firefox only (and last version I tested, was 3.x).
beforeunload and unload are specific events and string should be returned in their handlers. For security reasons, browser may only display a confirmation dialog with message provided (that string). Moreover, Firefox since version 4 even ignores that string and always displays standard message.
There's no way to silently prevent user from leaving page.
BTW backspace don't work as history.back() in Ubuntu.
Use a keydown handler on the document level:
document.onkeydown = function(e){
if (e.keyCode===8) {
return false;
}
};

Web page: detect and block certain keyboard shortcuts

I want to detect and block certain keyboard shortcuts on a web page. For example, say I want to prevent alt+tab for switching apps (just an example, assume any global shortcut).
Here's as far as I can think it out:
attach a keyboard event listener to
document (or window?)
use event.which to check which key
combination was pressed
if it was a blacklisted shortcut,
stop the browser from executing it
But, I don't know how to
A) detect multiple keys (e.g. alt and tab together), or
B) stop them from executing (can I just return false?).
Can anyone tell me how to accomplish the above?
You want to prevent screenshots from being taken? Forget it right now.
No matter what elaborate mechanisms you put into place, they will be trivial to circumvent by un-focusing the browser window (or just the document, e.g. by clicking into the address bar), and pressing the screenshot key then.
There is no chance for you to do this except by installing client software on the computer that controls what the user does, or maybe using some proprietary ActiveX control that makes its contents un-print-screenable. Both approaches are hugely difficult and have tons of downsides.
You cannot block keyboard combinations that belong to the OS. Only keyboard combinations that roam inside the browser and are not OS specific.
If you want to protect your content, don't publish it in public. Or put a decent license on it
// lookup table for keycodes
var key = { s: 83 };
document.onkeydown = function (e) {
// normalize event
e = e || window.event;
// detecting multiple keys, e.g: Ctrl + S
if (e.ctrlKey && !e.altKey && e.keyCode === key.s) {
// prevent default action
if (e.preventDefault) {
e.preventDefault();
}
// IE
e.returnValue = false;
}
};
Detecting Keystrokes Compatibility Table (QuirksMode)

Categories

Resources