JS實現方向鍵切換輸入框
阿新 • • 發佈:2019-02-01
程式碼如下
var array = []; $(document).ready(function(){ array[0] = [document.getElementById("a"),document.getElementById("b"),document.getElementById("c")]; array[1] = [document.getElementById("d"),document.getElementById("e"),document.getElementById("f")]; array[2] = [document.getElementById("g"),document.getElementById("h"),document.getElementById("i")]; array[3] = [document.getElementById("j"),document.getElementById("k"),document.getElementById("l")]; }); //方向鍵控制游標聚焦,外部陣列長度為4,內部陣列長度為3 function keyDown(event){ var focus=document.activeElement; if(!document.getElementById("inputItem").contains(focus)) return; var event=window.event||event; var key=event.keyCode; xfor:for(var j=0; j<array.length; j++){ for(var k=0; k<array[j].length; k++){ if(array[j][k] === focus){ break xfor; } } } switch(key){ case 37: //← if(j>=0 && k>0){ array[j][k-1].focus(); } if(j>=0 && k==0){ array[j-1][array[j-1].length-1].focus(); } break; case 38: //↑ if(j>=0 && k<3){ array[j-1][k].focus(); } if(j>=0 && k==3){ array[j-1][array[j-1].length-1].focus(); } break; case 39: //→ if(j<=4 && k<(array[j].length-1)){ array[j][k+1].focus(); } if(j<=4 && k==(array[j].length-1)){ array[j+1][0].focus(); } break; case 40: //↓ if(j<=4 && k<3){ array[j+1][k].focus(); } if(j<=4 && k==3){ array[j+1][array[j-1].length-1].focus(); } break; } }