JavaScript - Recorrer inputs por medio de las flechas del teclado

 
Vista:
Imágen de perfil de ScriptShow
Val: 2.019
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Recorrer inputs por medio de las flechas del teclado

Publicado por ScriptShow (670 intervenciones) el 26/01/2019 11:08:16
  • Scriptshow se encuentra ahora conectado en el
  • chat de PHP
Un script básico que sirve para desplazar el focus entre varios inputs por medio de las flechas del teclado...
Hemos identificado los inputs por ID con números; esto simplifica el manejo de los elementos, basándonos en el DOM, compatible con todos los Navegadores Web.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<!DOCTYPE html>
 
<html>
<body>
<input type="text" id="1" onclick="test(1)">
<input type="text" id="2" onclick="test(2)">
<input type="text" id="3" onclick="test(3)">
<input type="text" id="4" onclick="test(4)">
 
<script type="text/javascript">
<!--
var s, p=1;

function test(s) {
d=document.getElementById(s);
d.focus();
p=s;
}

function next() {
if (p < 4) {p++; test(p)}
}

function prev() {
if (p > 1) {p--; test(p)}
}

document.onkeydown=function(e) {
e = e || window.event;
if (e.keyCode == 37) {prev()}
if (e.keyCode == 39) {next()}
return;
}

test(p);
//-->
</script>
</body>
</html>

Forma parte de un ejercicio que fue planteado en el Chat de LWP. Finalmente, publicarlo en este Foro, puede ser de utilidad a otros usuarios.

Un saludo
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
1
Responder
Imágen de perfil de xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Recorrer inputs por medio de las flechas del teclado

Publicado por xve (2101 intervenciones) el 26/01/2019 21:40:02
Muy bueno ScriptShow!!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar