i am creating a system where there will be a pacific mobile view. From this you will be able to press one of 3 buttons and it will emulate a key press on a keyboard.
Currently for the desktop version the focused box changes like this:
$('.today').keydown(function(e) {
if ($.inArray(e.keyCode, [69, 88, 191, 8, 40, 38]) === -1) { // 8 is backspace
e.preventDefault();
}
});
$('.today').keyup(function(e) {
if ($.inArray(e.keyCode, [69, 88, 191, 8, 40, 38]) === -1) { // e, x, / respectively // don't print the character
return false;
}
var self = $(this);
var currentInput = self.data('number');
var next = $(currentInput + 1);
var previous = $(currentInput - 1);
var keyCode = e.keyCode || e.which;
var num = self.data('number') + 1;
var nom = self.data('number') - 1;
if(('input.today[data-number="' + num +'"]').length && keyCode === 40)
$('input.today[data-number="' + num +'"]').focus()
else if(('input.today[data-number="' + nom +'"]').length && keyCode === 38)
$('input.today[data-number="' + nom +'"]').focus();
else if(('input.today[data-number="' + num +'"]').length && self.val().length == self.attr('size')) {
$('input.today[data-number="' + num +'"]').focus();
}
});
For the buttons I have this piece of code:
$("button").click(function() {
$(".today").focus();
var e = jQuery.Event("keydown");
e.which = 47; // # Some key code value
$("input").val(String.fromCharCode(e.which));
$("input").trigger(e);
});
$('input').keypress(function(e){
console.log('Yes keydown triggered. ' + e.which)
});
This fills the text box and it will change to next, but then when i press it will focus back to original... Any ideas.
$(".today").focus();
suggests your using classes as the identifier, are your ID's unique?
Related
Good day, the following code works on desktop but not mobile. When I switch to keyup or keydown instead of keypress it doesn't work anywhere.
function attribUppercase(e)
{
var charInput = e.keyCode;
if((charInput >= 97) && (charInput <= 122)) { // lowercase
if(!e.ctrlKey && !e.metaKey && !e.altKey) { // no modifier key
var newChar = charInput - 32;
var start = e.target.selectionStart;
var end = e.target.selectionEnd;
e.target.value = e.target.value.substring(0, start) + String.fromCharCode(newChar) + e.target.value.substring(end);
e.target.setSelectionRange(start+1, start+1);
e.preventDefault();
}
}
}
window.onload = function() {
var element = document.getElementById("attrib-108-0");
if(typeof(element) != 'undefined' && element != null){
document.getElementById("attrib-108-0").addEventListener("keypress", attribUppercase, false);
}
}
I have the following code to indent a tab.
$('#submit-content').keydown(function(e) {
var keyCode = e.keyCode || e.which;
if (keyCode == 9 || e.metaKey && keyCode == 221) {
e.preventDefault();
var start = $(this).get(0).selectionStart;
var end = $(this).get(0).selectionEnd;
// set textarea value to: text before caret + tab + text after caret
$(this).val($(this).val().substring(0, start)
+ "\t"
+ $(this).val().substring(end));
// put caret at right position again
$(this).get(0).selectionStart =
$(this).get(0).selectionEnd = start + 1;
}
I want to alter this code to de-indent.
I tried -"\t" but it wont work as expected
I'm making a system where you press a key and it changes text box. I only want to be able to put the values X, x, E, e, /
My current jQuery code is
$('.today').keyup(function(e) {
var self = $(this);
var currentInput = self.data('number');
var next = $(currentInput + 1);
var previous = $(currentInput - 1);
var keyCode = e.keyCode || e.which;
var num = self.data('number') + 1;
var nom = self.data('number') - 1;
if(('input.today[data-number="' + num +'"]').length && keyCode === 40)
$('input.today[data-number="' + num +'"]').focus()
else if(('input.today[data-number="' + nom +'"]').length && keyCode === 38)
$('input.today[data-number="' + nom +'"]').focus();
else if(('input.today[data-number="' + num +'"]').length && self.val().length == self.attr('size')) {
$('input.today[data-number="' + num +'"]').focus();
}
});
I only want the focused box to move if the key up is one of these: X, x, E, e, /, UP, DOWN, LEFT, RIGHT. And if the values are not X, x, E, e, / then to not write in the box
This might help:
$('.today').keyup(function(e) {
if(~[38, 39, 40, ...].indexOf(e.keyCode || e.which)) {
e.preventDefault();
return;
}
...
}
The key there being the call to e.preventDefault().
You also have of the element the keyup event originated in as e.target.
HTH
You can examine the key that was pressed to determine how the event should proceed. If you don't want text to appear on certain key presses, then you can either return false from the handler, or call e.preventDefault():
if ($.inArray(e.keyCode, [69, 88, 191]) === -1) { // e, x, / respectively
e.preventDefault(); // don't print the character
}
You can get a list of the JavaScript keycodes here: Key Codes.
I want to make something where when you are in a input you can press a button and it will fill it with a character(depending on the button) and move onto the next input.
$('.today').keyup(function(e) {
if ($.inArray(e.keyCode, [69, 88, 191]) === -1) { // e, x, / respectively
e.preventDefault(); // don't print the character
return false;
}
var self = $(this);
var currentInput = self.data('number');
var next = $(currentInput + 1);
var previous = $(currentInput - 1);
var keyCode = e.keyCode || e.which;
var num = self.data('number') + 1;
var nom = self.data('number') - 1;
if(('input.today[data-number="' + num +'"]').length && keyCode === 40)
$('input.today[data-number="' + num +'"]').focus()
else if(('input.today[data-number="' + nom +'"]').length && keyCode === 38)
$('input.today[data-number="' + nom +'"]').focus();
else if(('input.today[data-number="' + num +'"]').length && self.val().length == self.attr('size')) {
$('input.today[data-number="' + num +'"]').focus();
}
});
$('.today').keyup(function(e) {
if ($.inArray(e.keyCode, [69, 88, 191]) === -1) {
$( this ).next().focus();
}else{
return false;
}
});
I am making a game based off of a tutorial at http://www.lostdecadegames.com/how-to-make-a-simple-html5-canvas-game/ it is going well but I wanted to make the function that reads if the two items are touching only happen when the space bar is pressed.
if (hero.x <= (monster.x + 32)
&& monster.x <= (hero.x + 32)
&& hero.y <= (monster.y + 32)
&& monster.y <= (hero.y + 32)) {
++monstersCaught;
reset();
}
if (hero.x <= (tack.x + 32)
&& tack.x <= (hero.x + 32)
&& hero.y <= (tack.y + 32)
&& tack.y <= (hero.y + 32)) {
monstersCaught -= monstersCaught;
reset();
}
if (monstersCaught > 10) {
monstersCaught -= 10;
}
How should I fix the
if (hero.x <= (tack.x + 32)
&& tack.x <= (hero.x + 32)
&& hero.y <= (tack.y + 32)
&& tack.y <= (hero.y + 32)) {
monstersCaught -= monstersCaught;
reset();
}
so that it only goes if the space bar is pressed?
Most easy way is to know at any moment the status of your keyboard : for that you have to listen to keyboard events and update an array containing the status of each key.
This will lead to something like :
window.keyStates = []; // now you can use keyStates anywhere.
// good enough since you seem to be in the first steps.
window.addEventListener('keydown',
function(e) { keyStates[e.keyCode || e.key] = true;} );
window.addEventListener('keyup',
function(e) { keyStates[e.keyCode || e.key] = false;} );
Once you have done that, you can test anywhere, anytime, the status of the space key with :
if (keyStates[32] == true) { ... }
you might prefer, for readability, define a key object that will hold the few keycodes you use :
window.key = {
space : 32,
enter : 13,
left : 37,
up : 38,
right : 39,
down : 40
}
that way, you can write :
if ( keyStates[key.space] == true ) {
...
}
which is more easy to grasp.
(Rq : if you search for keycodes, looking here is one way : https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent )
If you use jQuery you can do something similar to this:
$(window).keypress(function(e) {
if (e.which === 32) {
//do your logic here
}
});
32 is the keycode for spacebar
Or in just javascript (Run this code in Document ready as displayunicode(event)):
function displayunicode(e){
var unicode=e.keyCode? e.keyCode : e.charCode;
if(unicode == 32){
//do your code
}
}