Develop Reference

HTML form focus

How do i simulate enter key pressed to behave like tab. I would not like to use jQuery. I simply need to blur(loose focus) on current input (textfield) and focus on next (input) element. I tried this but it doesn´t work.
const handleKeyUp = (event) => {
const keyCode = event.keyCode || event.which;
if (event.target.value !== '' && keyCode === 13) {
event.preventDefault();
event.target.blur();
event.target.dispatchEvent(new KeyboardEvent('keypress', { key: 'Tab' }));
}
};

You can't trigger default browser behaviour by simulating events.
You'll need to identify the next field in the tab order, find it in the DOM, then call its focus() method.

$(document).on('keydown', ':tabbable', function (e) {
if (e.which == 13 || e.keyCode == 13 ) {
e.preventDefault();
var $canfocus = $(':tabbable:visible')
var index = $canfocus.index(document.activeElement) + 1;
if (index >= $canfocus.length) index = 0;
$canfocus.eq(index).focus();
}
});
Example

Ctrl+u double make not hide

The below code works fine, but if I click double Ctrl+u then it opens all. How can I disable all?
Ctrl+u, Ctrl+s, right-click, F12 key and more key for hide code?
document.onkeydown = function(e) {
if (e.ctrlKey && (e.keyCode === 67 || e.keyCode === 86 || e.keyCode === 85 || e.keyCode === 117)) { //Alt+c, Alt+v will also be disabled sadly.
alert('not allowed');
}
return false;
};

you have to put e.stopImmediatePropagation();
/*function check(e)
{
alert(e.keyCode);
}*/
document.onkeydown = function(e) {
if (e.ctrlKey && (e.keyCode === 67 || e.keyCode === 86 || e.keyCode === 85 || e.keyCode === 117)) { //Alt+c, Alt+v will also be disabled sadly.
alert('not allowed');
e.stopImmediatePropagation();
}
return false;
};

Try to use the e.preventDefault() function. it will stop the browser to do the default actions when in this case a key combination has been pressed.
The key code for the F12 button is 123. To detect the 'contextmenu' event (user clicks right button), you also have to use the preventdefault function to avoid opening the contextmenu. Maybe this will help you:
Live preview: https://jsfiddle.net/cmLf34h3/1/
document.onkeydown = function(e) {
if (e.ctrlKey && (e.keyCode === 67 || e.keyCode === 86 || e.keyCode === 85 || e.keyCode === 117) || e.keyCode === 123) { //Alt+c, Alt+v will also be disabled sadly.
alert('not allowed');
e.preventDefault();
}
return false;
};
window.oncontextmenu = function (e)
{
alert("You have tested if your right-mousebutton is still working. This alert confirms it's still working, have a nice day!")
e.preventDefault();
return false; // cancel default menu
}
Source for the right-click function: Is right click a Javascript event?
Note: You cannot 100% prevent these actions, there is always a backdoor to bypass this.
I hope this helps

jQuery keyboard activate a button

this is what I got so far
http://jsfiddle.net/qEKfg/
It's two buttons that activate on click and look like keyboard keys.
I'm trying to make it where they will only activate (animate) on a keyboard press of the related keys (CTRL and D)
This will make an 'animated buttons' effect for bookmarking my website, because CTRL+D is the hotkey to bookmark a page.
But I don't know how to set it up to work with keyboard keys in html or jQuery
if some could help I would be really REALLY grateful

The following should work for you. However, note that due to the window losing focus, I've added in a timer to release the on-screen 'buttons' after 5 seconds, as the window losing focus at that specific time prevents the keyup event from firing.
$(document).ready(function() {
var keys = [];
$(window).on('keydown keyup', function(e) {
if (e.type == "keydown") {
if (e.keyCode == 17 || e.keyCode == 91) {
$("a.a_demo_two:contains('CTRL')").addClass("active");
keys[0] = e.keyCode;
}
else if (e.keyCode == 68) {
$("a.a_demo_two:contains('D')").addClass("active");
keys[1] = 68;
};
if ((keys[0] == 17 || e.keyCode == 91) && keys[1] == 68) {
setTimeout(function() {
$('a.a_demo_two').removeClass("active");
}, 5000);
}
}
else {
if (e.keyCode == 17 || e.keyCode == 91) {
$("a.a_demo_two:contains('CTRL')").removeClass("active");
}
else if (e.keyCode == 68) {
$("a.a_demo_two:contains('D')").removeClass("active");
}
keys = [];
}
});
});​
DEMO

Basically you just put handler on keydown and keyup events and trigger whatever you want.
Something like that
$('body').on('keydown', function(e) {
console.log(e)
if (e.ctrlKey) $('.a_demo_two').trigger('mousedown')
if (e.keyCode === 100) $('.a_demo_two').trigger('mousedown')
});
$('body').on('keyup', function(e) {
console.log(e)
if (e.ctrlKey) $('.a_demo_two').trigger('mouseup')
if (e.keyCode === 100) $('.a_demo_two').trigger('mouseup')
});
​

Know if input is in use and disable the hotkey (Jquery)

I use some hotkeys on my website, but when the user is inside the search form or inside comment. I want to disable them.
What the best for me to do it? Thanks
Example of my hotkey:
$(document).keydown(function(e)
{
if (e.which == 40 || e.which == 74) // next post
{
return scroll('next');
}
if (e.which == 38 || e.which == 75) // prev post
{
return scroll('prev');
}
});

You can check for the event.target element. If that element is from type INPUT you might want to omit the handler code. Could look like
$(document).keydown(function(e)
{
if( e.target.nodeName !== 'INPUT' ) {
if (e.which == 40 || e.which == 74) // next post
{
return scroll('next');
}
if (e.which == 38 || e.which == 75) // prev post
{
return scroll('prev');
}
}
});

You could check if e.target.nodeName === INPUT (the event is triggered inside an input field) and act accordingly

Insert a CR/LF into a textarea

I've got the following code:
document.onkeydown=function(e) {
if (e.which == 13 && isCtrl) {
log('Ctrl CR');
} else if (e.which == 17) {
isCtrl = true;
};
I need to insert a Carriage Return/Line feed where the cursor is located in the input textarea.
Now that I think about it, I should probably be using a textarea selector instead of document.onkeydown, but $('textarea').onkeydown doesn't work.

$('textarea').keydown(function (e){
var $this = $(this);
if (e.which === 13 && e.ctrlKey) {
$this.val($this.val() + '\r\n'); // untested code (to add CRLF)
}
});
Reference
.keydown
Event object