Recorrer inputs por medio de las flechas del teclado
Publicado por ScriptShow (692 intervenciones) el 26/01/2019 11:08:16
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.
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
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
1
