Trap keypress using jquery - javascript

I have written a code block to trap key press on Ctrl + sit works and an alert has been placed when the event has ran to show me that the code block has successfully ran. later this code block will be replaced by a save command.
However I am having some trouble as the first time Ctrl + s is pressed it works however every time afterwards the s button alone triggers the event
here is the code block:
var isCtrl = false;
ck.on('contentDom', function (evt) {
ck.document.on('keyup', function (event) {
if (event.data.$.keyCode === 17) isCtrl = false;
});
ck.document.on('keydown', function (event) {
if (event.data.$.keyCode === 17) isCtrl = true;
if (event.data.$.keyCode === 83 && isCtrl === true) {
//The preventDefault() call prevents the browser's save popup to appear.
//The try statement fixes a weird IE error.
try {
event.data.$.preventDefault();
} catch (err) { }
alert('ctrl-s');
return false;
}
});
}, ck.element.$);
}
any help is greatly appreciated.

This is a way to perform ctrl+s command in jquery that works every time:
$(window).keypress(function(event) {
if (!(event.which == 115 && event.ctrlKey) && !(event.which == 19)) return true;
alert("Ctrl-S pressed");
event.preventDefault();
return false;
});

This post is for anyone who has also had trouble with this problem, I have now solved it. The problem with my original code block is that once isCtrl was set as true it remained true. which meant that when time came again to check if it was pressed it didn't matter whether it was pressed again as it was already set to true. there for I have added a line to change it back to false when the conditional statements have ran.
Here is the new code block:
var isCtrl = false;
ck.on('contentDom', function (evt) {
ck.document.on('keyup', function (event) {
if (event.data.$.keyCode === 17) isCtrl = false;
});
ck.document.on('keydown', function (event) {
if (event.data.$.keyCode == 17) isCtrl = true;
if (event.data.$.keyCode == 83 && isCtrl === true) {
//The preventDefault() call prevents the browser's save popup to appear.
//The try statement fixes a weird IE error.
try {
event.data.$.preventDefault();
} catch (err) { }
alert('ctrl-s');
isCtrl = false;
return false;
}
});
}, ck.element.$);
}

Related

How to disable View source and inspect element

How do you disable/ view source/ and /inspect element/, ctrl + u ctrl+shift+I f12 menu bar and right click, also ctrl + s ctrl p ctrl+v ctrl+a ctrl+c and drag select page, please answer all parts that's possible, I prefer to do this will JavaScript array keycodes or html no php or other languages.also I want to block ifram use on my site like somesites such as google.
As I understand it is not possible to completely disable view source and inspect element, so I want minification of code and rest of my question answered instead.
Edit:
I solved alot of it myself, I used onkeydown return false to disable all keys, still need the arrays, I disabled inspect element menu bar by forcing browser to window.open I still need right click, however would like to add that I need a custom right click menu, I disabled the possibility to disable Javascript in order to stop the key block by using noscript function redirects. I also still need the drag and select part. I would still like betterways to fix it...maybe even just minify the code or encrypt it. Of anyone needs some of the code I used just reply. I just need to fix it.
It is not possible to prevent the user from inspecting code running on their machine. At the end of the day the HTMl they are getting delivered will be readable in plain text. You can cause a nuisance for most people, but this will not be a valid security measure - chrome extensions will still run, for instance, so if someone is using the NoScript extension it will disable all javascript.
A much better option would be to handle your logic serverside, and only send the client the information they need to know/requested.
There are some free javascript obfuscators, such as https://javascriptobfuscator.com/. Please remember that it is not a secure method, though.
I mean no matter how much you block it a person can just type
view-source:https://example.com
document.onkeydown = function(e)
{
if(event.keyCode == 123)
{
return false;
}
if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0))
{
return false;
}
if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0))
{
return false;
}
if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0))
{
return false;
}
if(e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0))
{
return false;
}
}
e is a keyboard event. e.[key] returnes true if key pressed.
If document.onkeydown returns false, key doesn't count.
This programm seeing if code view combination pressed and returning false.
Example. if ctrl, shift and 'J' pressed - return false.
Bump
To the people saying it isn't possible, how would you recon this website managed to do so?
The following website disabled, view source, right click and the dev console.
I am genuinely interested.
https://www.techgyd.com/contact-facebook-directly/6579/
Edit:
all input from keyboard is disabled, but by adding "view-source:" before the httpps:// to the url to become:
view-source:https://www.techgyd.com/contact-facebook-directly/6579/
makes me able to see.
If you would like to know how they did that then take a look at their JS, raw copy/paste:
<script type="text/javascript">
//<![CDATA[
var show_msg = '';
if (show_msg !== '0') {
var options = {view_src: "View Source is disabled!", inspect_elem: "Inspect Element is disabled!", right_click: "Right click is disabled!", copy_cut_paste_content: "Cut/Copy/Paste is disabled!", image_drop: "Image Drag-n-Drop is disabled!" }
} else {
var options = '';
}
function nocontextmenu(e) { return false; }
document.oncontextmenu = nocontextmenu;
document.ondragstart = function() { return false;}
document.onmousedown = function (event) {
event = (event || window.event);
if (event.keyCode === 123) {
if (show_msg !== '0') {show_toast('inspect_elem');}
return false;
}
}
document.onkeydown = function (event) {
event = (event || window.event);
//alert(event.keyCode); return false;
if (event.keyCode === 123 ||
event.ctrlKey && event.shiftKey && event.keyCode === 73 ||
event.ctrlKey && event.shiftKey && event.keyCode === 75) {
if (show_msg !== '0') {show_toast('inspect_elem');}
return false;
}
if (event.ctrlKey && event.keyCode === 85) {
if (show_msg !== '0') {show_toast('view_src');}
return false;
}
}
function addMultiEventListener(element, eventNames, listener) {
var events = eventNames.split(' ');
for (var i = 0, iLen = events.length; i < iLen; i++) {
element.addEventListener(events[i], function (e) {
e.preventDefault();
if (show_msg !== '0') {
show_toast(listener);
}
});
}
}
addMultiEventListener(document, 'contextmenu', 'right_click');
addMultiEventListener(document, 'cut copy paste print', 'copy_cut_paste_content');
addMultiEventListener(document, 'drag drop', 'image_drop');
function show_toast(text) {
var x = document.getElementById("amm_drcfw_toast_msg");
x.innerHTML = eval('options.' + text);
x.className = "show";
setTimeout(function () {
x.className = x.className.replace("show", "")
}, 3000);
}
//]]>
</script>
or just look from line 86
I hope it helps

visualforce page javascript button click not working

I have a visualforce page (Salesforce) where I'm trying to capture the user pressing enter in a text field and firing a button click.
Here is my jquery code:
$(document).ready(function() {
$("#thisPage\\:theForm\\:siteNumber").keypress(function() {
if(window.event){
key = window.event.keyCode; //IE, chrome
}
else{
key = e.which; //firefox
}
if(key == 13) {
$("#thisPage\\:theForm\\:siteButton").click();
}
});
});
Its very odd, I've verified the key equals 13 and its entering the if statement. I've also tried moving the .click() action above the if key==13 condition and it fires fine. It just doesn't work inside the if key==13 condition I know its entering.
I've recreated what its basically doing in this simple fiddle, but of course it works fine: http://jsfiddle.net/2adPe/
Any help is appreciated!
UPDATE:
I've figured out that this will work
function noenter(e){
if(window.event){
key = window.event.keyCode; //IE, Chrome
}
else{
key = e.which; //firefox
}
if(key == 13) {
document.getElementById('thisPage:theForm:siteButton').click();
return false;
}
else{
return true;
}
}
with
onkeypress="return noenter(event)"
on the textbox. Is there a way to do this unobtrusively??
Try referencing your element IDs using the jQuery Attribute Ends With Selector.
Like this:
$("[id$='input1']").on("keypress",function(e) { // e is the current event
if(e){
key = e.keyCode; // IE, chrome
}
else{
key = e.which; // firefox
}
if(key == 13) {
e.preventDefault(); // prevent a form submit when pressing enter (on IE)
$("[id$='siteButton']").click(); // simulate a click of the siteButton
}
});
Also, you'll want to prevent the default action if the key == 13. Otherwise, the button click might be executed twice.
http://jsfiddle.net/2adPe/3/
Finally got it! I had to remove the e.preventdefault() from before the .click() and add return false at the end that stopped the default action from happening.
$('input[name$="siteNumber"]').keypress(function() {
if(window.event){
key = window.event.keyCode; //IE, chrome
}
else{
key = e.which; //firefox
}
if(key == 13) {
$('input[name$="siteButton"]').click();
return false;
}
});

Stuck alt / modifier key with Javascript

I have a library that creates an editor on the fly (http://epiceditor.com) and also sets up key shortcuts automatically. The shortcuts can be configured in the options so I can't use e.altKey, e.ctrlKey, etc just a heads up.
For some reason the modifier key isn't being set back to false sometimes on Mac/Ubuntu browsers.
On Windows it seems to happen every time. You can reproduce this by clicking render in JSBin then pressing alt+p. You should see "Yay" appear. Now, if on Windows press just p again. You'll see "Yay appear again. Mac and Ubuntu users have seen this same issue occasionally but it's hard to reproduce it.
Also note this only happens with the alt key it seems. Below I have 16 (shift) next to the 18 (alt). If you swap those out it'll work as expected.
The code for the stripped down test case is:
var modKey = false;
var modKeyCode = 18; //16
document.body.addEventListener('keydown', function (e) {
if (!modKey && modKeyCode == e.keyCode) {
modKey = true;
}
if (modKey && e.keyCode == 80) {
console.log('Yay!');
}
});
document.body.addEventListener('keyup', function (e) {
if (modKey && modKeyCode == e.keyCode) {
modKey = false;
}
});
Demo: http://jsbin.com/uhupah/3/edit#javascript,html
I do not have access to my Linux box at the moment, so i cannot test your code.
Thus here is more of a suggestion:
Linux (in my experience) is finicky when it it comes to keyCodes and order of key events. Perhaps combine the if(..) from keyup with that of keydown
if (!modKey && modKeyCode == e.keyCode) {
modKey = true;
} else if (modKey && modKeyCode == e.keyCode) {
modKey = false;
}
The above suggestion is made with assumption that you have no specific requirement to have both 'keydown' and 'keyup'.
I've come up with a fix, albeit a sort of crappy fix, but a fix nonetheless.
The fix I went with was to reset the modifier var when any key combo was successful. I.e. one the p in alt+p is pressed reset the modKey to false like this:
var modKey = false;
var modKeyCode = 18; //16
document.body.addEventListener('keydown', function (e) {
if (!modKey && modKeyCode == e.keyCode) {
modKey = true;
}
if (modKey && e.keyCode == 80) {
console.log('Yay!');
modKey = false; //THIS
}
});
document.body.addEventListener('keyup', function (e) {
if (modKey && modKeyCode == e.keyCode) {
modKey = false;
}
});
The problem with this tho is that you can't do back to back key commands. Most of the time this is alright because the user will do a key command like "save" or "preview" or something, type some more, then do another key command. But you wouldn't be able to, let's say: alt+p s to trigger alt+p then alt+s without having to let go of the alt key.

Simulate multiple keypresses in javascript

I would like to simulate the user pressing tab then enter when they press enter. I know this sounds bad, but I have an asp.net web application that will only allow me to have one form with runat="server" on it so when the user hits return the main form gets submitted. I have another textbox on the page though (that ideally should have it's own form but can't because it is asp), and when enter is hit from there obviously the main form is submitted. The simplest way I could think is to simulate tab then enter using javascript, but I have been unsuccessful in that. I am welcome to any other solutions to this problem. So far I have simulated pressing tab, but I don't know how to simulate more than one keypress though.
Here is the code I have so far, I imagine return 9; needs to be replaced with something else. JQuery will also do.
function suppressEnter (e) {
var keyPressed;
if (window.event) { keyPressed = window.event.keyCode } // IE
else if (e) { keyPressed = e.which }; // Netscape
if (keyPressed == 13) {
return 9;
}
else {
return true;
}
}
EDIT: return 9 + 13; works in chrome, but not IE
Something like this would work:
function keyPress(e) {
if (e.which == 13) {
$(document).trigger(jQuery.Event('keydown', {which: 9}));
// do something
alert('Enter')
}
if (e.which == 9) {
// do something
alert('Tab');
}
};
$(document).bind("keydown", keyPress);
I've coded it up in a fiddle - http://jsfiddle.net/FAe6U/
Also With regards to #nnnnnn comment:
It seems to me you should just code that directly rather than trying
to simulate keystrokes.
Try this:
var tabPress;
function keyPress(e) {
if (e.which == 13) {
if (tabPress == 1){
e.preventDefault();
alert('tab and enter');
}
else{e.preventDefault(); alert('enter')}
}
else if (e.which == 9) {
e.preventDefault();
tabPress = 1;
};
};
function keyRelease(){tabPress = 0;}
$(document).bind("keydown", keyPress);
$(document).bind("keyup", keyRelease);
I've coded it up in a fiddle - http://jsfiddle.net/f4Ybn/

Fire event on Control+C, but still allow copy

I'm trying to run some code when the user presses control+c on a webpage, but I still want that key action to copy whatever the user has selected. With my current code, only the events I write actually happen and the default action is ignored.
Is this possible? Here's the code I'm using:
Code for control key functionality
$.ctrl = function(key, callback, args) {
var isCtrl = false;
$(document).keydown(function(e) {
if(!args) args=[]; // IE barks when args is null
if(e.ctrlKey) isCtrl = true;
if(e.keyCode == key.charCodeAt(0) && isCtrl) {
callback.apply(this, args);
return false;
}
}).keyup(function(e) {
if(e.ctrlKey) isCtrl = false;
});
};
Code for Control+C:
$('input').click(function(){
$(this).addClass('selected');
$(this).focus();
$(this).select();
});
$('input').blur(function(){
$('input.selected').removeClass('selected');
});
$.ctrl('C', function() {
if( $('input.selected').length != 0 )
{
alert("Saved");
}
});
Remove the line return false;

Categories