Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Bảng » Tạo focus cho ô
URL: https://www.javascriptbank.com/keyboardtable.html
Hiệu ứng dùng để tô màu và tạo focus cho ô trong bảng.
Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Bảng » Tạo focus cho ô
URL: https://www.javascriptbank.com/keyboardtable.html
<SCRIPT language=javascript>var x=1; //begin in colum number 1 empezar en columna 1var y=1; //begin in row 1 empezar en fila 1var xmax = 6; //total columns of table número total de columnasvar ymax = 6; //total rows of table número total de filasfunction teclaPulsada(){// alert(event.keyCode+" "+x+" "+y)switch (event.keyCode){case 40: //tecla abajo key down document.getElementById('tabla').rows[y].cells[x].bgColor='#FFFFFF';if (y==5){y=0;} else {y++;} document.getElementById('tabla').rows[y].cells[x].bgColor='#CC66FF';window.status="arriba";breakcase 38: //tecla arriba key up document.getElementById('tabla').rows[y].cells[x].bgColor='#FFFFFF';if (y==0){y=5;} else {y--;} document.getElementById('tabla').rows[y].cells[x].bgColor='#CC66FF';window.status="abajo";breakcase 37: //tecla izquierda key left document.getElementById('tabla').rows[y].cells[x].bgColor='#FFFFFF';if (x==0){x=5;} else {x--;} document.getElementById('tabla').rows[y].cells[x].bgColor='#CC66FF';window.status="izquierda";breakcase 39://tecla derecha key rigth document.getElementById('tabla').rows[y].cells[x].bgColor='#FFFFFF';if (x==5){x=0;} else {x++;} document.getElementById('tabla').rows[y].cells[x].bgColor='#CC66FF';window.status="derecha";breakdefault:window.status="pulse una flecha para desplazarse en la tabla pres one of the arrow keys for move";}}function cambiarFondo() { document.getElementById('tabla').rows[y].cells[x].bgColor='#CC66FF';}</SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><BODY onkeyup=teclaPulsada()><TABLE id=tabla border=2> <TBODY> <TR> <TD width=100>celda00</TD> <TD width=100>celda01</TD> <TD width=100>celda02</TD> <TD width=100>celda03</TD> <TD width=100>celda04</TD> <TD width=100>celda05</TD></TR> <TR> <TD width=100>celda10</TD> <TD width=100>celda11</TD> <TD width=100>celda12</TD> <TD width=100>celda13</TD> <TD width=100>celda14</TD> <TD width=100>celda15</TD></TR> <TR> <TD width=100>celda20</TD> <TD width=100>celda21</TD> <TD width=100>celda22</TD> <TD width=100>celda23</TD> <TD width=100>celda24</TD> <TD width=100>celda25</TD></TR> <TR> <TD width=100>celda30</TD> <TD width=100>celda31</TD> <TD width=100>celda32</TD> <TD width=100>celda33</TD> <TD width=100>celda34</TD> <TD width=100>celda35</TD></TR> <TR> <TD width=100>celda40</TD> <TD width=100>celda41</TD> <TD width=100>celda42</TD> <TD width=100>celda43</TD> <TD width=100>celda44</TD> <TD width=100>celda45</TD></TR> <TR> <TD width=100>celda50</TD> <TD width=100>celda51</TD> <TD width=100>celda52</TD> <TD width=100>celda53</TD> <TD width=100>celda54</TD> <TD width=100>celda55</TD></TR></TBODY></TABLE><FORM name=formDePrueba><INPUT onclick=cambiarFondo() type=button value="foco a celda 1 1 focus to cell 1 1" name=focoAcelda11> </FORM></BODY><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->