js 포커스 제어를 위한 위, 아래, 왼쪽 및 오른쪽 키(샘플 코드)_javascript 기술

아래와 같습니다.

코드를 복사하세요 코드는 다음과 같습니다.

/ /begin-- -------------위, 아래, 왼쪽 및 오른쪽 키 제어

if('${iscontrol_mchntid}'.indexOf('${mchntid}')!=-1){

var texts = new Array();
//포커스가 있는 위치로 설정
var x = 2;
var y = 3;
var maxx = 0;
var maxy = 0;
window.onload=function(){
var inputs = $("[location]");
for(var i = 0; i < inputs.length; i ){
texts.push(inputs[i]);
}
for(var i = 0; i < texts.length; i ){
texts[i].onfocus = new Function( "setCurrent('" texts[i].getAttribute("location") "')");
var crtx =parseInt(texts[i].getAttribute("location").split(",") [0 ]);
var crty =parseInt(texts[i].getAttribute("location").split(",")[1]);
maxx = maxx <x crtx : maxx;
maxy = maxy < crty ? crty : maxy;
texts[i].onkeydown = function(e){
e = e || window.event;
switch(e.keyCode) {
case 38:setPosition(x,y,38);break;// 대문자
case 40:setPosition(x,y,40);break;// Lower
case 37:setPosition(x ,y ,37);break;// 왼쪽
case 39:setPosition(x,y,39);break;// 오른쪽
case 45:setPosition(x,y,45);break; // 키 삽입/입력 상자의 리턴 키는 삭제, 입력 라이브러리에 값이 있으면 삭제, 그렇지 않으면 이전 페이지로 돌아갑니다
default:return true;
}
};
}
};
함수 setPosition(x,y,keyCode){

<… 왼쪽과 오른쪽, x 좌표와 y 좌표만 변경됨 자동 변경

if(keyCode == '38' && x == '3'){
if(y=='3'||y =='4'||y=='5'| |y=='6'||y=='7'||y=='8'){
y='3';
}
}
if(keyCode == '40' && x == '4'){
if(y=='3'||y=='4'||y== '5'||y=='6'||y =='7'||y=='8'){
y='3';
}
}
/ /여기에 위치를 동적으로 변경하는 논리를 추가합니다----끝

if(keyCode == '38'){
x = --x;

}

if(keyCode == '40'){
x = x;
if(keyCode == '37'){
y = --y;
}
if(keyCode == '39'){
y = y;
movePosition(x,y,keyCode);
}
function movePosition(x1,y1,keyCode){
if(keyCode == '45'){
//커서 위치 객체가 입력될 때
var st = x1 "," y1;
if($("input[location='" st "']").attr("type")=="text "){
var oldval = $("input[location='" st "']").val();
var newval = oldval.substring(0,oldval.length-1);
$( "input[location='" st "']").val(newval);
return false;
}else{
history.go(-1)
return false ;
}
}
x1 > maxx ? 1 : x1;
y1 = y1 > 1 : y1;
x1 = x1 < ;
y1 = y1 < 1 ? 맥시 : y1;

var j = 0;
for(; j < texts.length; j ){
if(texts[j].getAttribute("location") == x1 "," y1){
texts[j].focus();

break;

}
}
if(j == texts.length){
switch(keyCode){
case 38 :movePosition(--x1,y1,keyCode);break;// 대문자
case 40:movePosition(x1,y1,keyCode);break;// Lower
case 37:movePosition(x1,--y1 ,keyCode);break;// 왼쪽
case 39:movePosition(x1, y1,keyCode);break;// 오른쪽
}
}
}
function setCurrent(location){
x = location.split(",")[0];
y = location.split(",")[1];
}
}
//end-- -------------위, 아래, 왼쪽, 오른쪽 키를 사용하여 제어