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
Related
I am trying to disable the browser search functionlity and at the same time i want to focus my own custom search box in website.
here is code for the same.
document.addEventListener("keydown", function(e) {
if (e.keyCode == 70 && e.ctrlKey || e.keyCode === 114) {
document.getElementById("myInput").focus();
}
e.preventDefault();
})
it disable the browser search feature and focus my custom search bar but it does not allow me to type anything in my custom search input.
The preventDefault() should be used only if the relevant key is the ctrl+f:
document.addEventListener("keydown", function(e) {
if (e.keyCode == 70 && e.ctrlKey || e.keyCode === 114) {
document.getElementById("myInput").focus();
e.preventDefault();
}
})
<input id="myInput" />
Otherwise you prevent any keydown that use is doing...
keycode is now deprecated. Use this:
window.addEventListener("keydown", function(e) {
if ( (e.code == "0x0021" && e.key == "Control") || e.code == "0x003D") {
document.getElementById("myInput").focus();
e.preventDefault();
}
})
<input id="myInput" />
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
I add form using jquery append method and this method has .numerik_kontrol class but this functions working are another form but it's not working on my dynamic form
my function;
$(document).ready(function(){
/** numerik kontrol*/
$(".numerik_kontrol").keydown(function (e) {
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl+A, Command+A
(e.keyCode === 65 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: home, end, left, right, down, up
(e.keyCode >= 35 && e.keyCode <= 40)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
/** numerik kontrol bitiş*/
/** select seçim*/
$(".btn_ekle").on("click", function(e) {
var ekle = $(".ekle").html();
$(".add_after").append(ekle).show();
e.preventDefault();
});
$(document).on('change', '.havale_tipi', function() {
var value = $(this).val(),
parent = $(this).closest(".group");
if (value == "iban_no") {
$(".hesaba_form", parent).fadeOut();
$(".iban_no_form", parent).fadeIn();
} else {
$(".iban_no_form", parent).fadeOut();
$(".hesaba_form", parent).fadeIn();
}
});
$(document).on("click", ".iade_sil", function() {
var form_sil;
var form_sil = confirm("Formu silmek istediğinize emin misiniz ?");
if (form_sil == true) {
$(this).closest(".group").remove();
} else {
return false;
}
});
document.getElementById('iade_miktari').className="numerik_kontrol";
});
if you wanna check out full click this link - demo page
if you click bottom of the form button(left button) you gonna see dynamic forms
In your $(document).ready use a $(document).on event handler instead of a keydown handler on existing numerik_kontrol elements. This will bind the handler to the document and evaluate the selector when every keydown event occurs, instead of directly binding the handler to the result of the single selector evaluation in $(document).ready
i.e.
instead of:
$(".numerik_kontrol"),keydown(function(e) { ...
try something more like this:
$document.on("keydown", ".numerik_kontrol", function(e) { ...
I faced this issue in my AngularJS webapp.
When a user enters a page with a form to fill and he starts typing, if he presses the backspace key and the focus is not on the input text, then the page goes to the previous state.
I looked up this solution using jQuery, but it doesn't seem the appropiate way for achieve this in AngularJS.
There is $document in angular js:
angular.module('yourModule', [])
.controller('yourController', ['$scope', '$document', function($scope, $document) {
$document.on('keydown', function(e){
if(e.which === 8 && ( e.target.nodeName !== "INPUT" && e.target.nodeName !== "SELECT" ) ){ // you can add others here inside brackets.
e.preventDefault();
}
});
}
]);
Plnkr Demo.
You can see in the demo i have used only for "INPUT" nodeName and it does not prevent the default of the backspace key on text input but not on textarea because we have not handled it in the condition.
I can't comment "accepted answer", but it will work not right, as condition
e.which === 8 && e.target.nodeName !== "INPUT" || e.target.nodeName !== "SELECT"
with logic error, so you can use
e.which === 8 && e.target.nodeName !== "INPUT" && e.target.nodeName !== "SELECT"
or answer that wrote #ThisIsMarkSantiago.
Add the below script in your controller
var rx = /INPUT|SELECT|TEXTAREA/i;
$document.on("keydown keypress", function(e){
if( e.which == 8 ){ // 8 == backspace
if(!rx.test(e.target.tagName) || e.target.disabled || e.target.readOnly ){
e.preventDefault();
}
}
});
Or you can use Jquery
$(function(){
var regx = /INPUT|SELECT|TEXTAREA/i;
$(document).bind("keydown keypress", function(e){
if( e.which == 8 ){ // 8 == backspace
if(!regx.test(e.target.tagName) || e.target.disabled || e.target.readOnly ){
e.preventDefault();
}
}
});
});
I got this answer here:
How can I disabling backspace key press on all browsers?
$(document).keydown(function(e) {
var nodeName = e.target.nodeName.toLowerCase();
if (e.which === 8) {
if ((nodeName === 'input' && e.target.type === 'text') ||
nodeName === 'textarea') {
// do nothing
} else {
e.preventDefault();
}
}
});
Just put it inside your controller.
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')
});