주요 브라우저와 호환되는 입력 포커스 구현 아이디어 및 코드를 전환하려면 입력하세요_jquery

프로젝트 작업 시 고객님께서 엔터로 입력(포커스)을 직접 전환할 수 있게 해달라고 요청하셨고, 마지막에 도달하면 바로 정보를 제출할 수 있게 해 주셨습니다.

첫 번째 아이디어는 온라인에서 코드를 복사하여 직접 사용하는 것입니다. 하지만 바이두와 구글에서 검색한 결과 발견된 코드의 80% 이상이 동일했습니다. 일부 코드는 너무 오래되어 사용할 수 없습니다. 일부는 일부 브라우저에서만 작동합니다. 30분 동안 고생한 후에도 여전히 적절한 해결책을 찾을 수 없었습니다. 마지막으로 생각해 보면 내가 직접 하는 편이 나을 것 같다.

1. 아이디어

Enter를 클릭할 때마다 현재 초점 위치를 가져온 후 다음 요소를 설정하여 초점을 맞춥니다.

2. 코드

<script type="text/javascript">
$('input:text:first').focus(); 
document.onkeydown = function enterHandler(event)
{
var inputs = $("input"); //可自行添加其它过滤条件 
var browser = navigator.appName ; //浏览器名称
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 

var Code = '' ;
if(browser.indexOf('Internet')>-1) // IE 
Code = window.event.keyCode ;
else if(userAgent.indexOf("Firefox")>-1) // 火狐
Code = event.which;
else // 其它
Code = event.keyCode &#63; event.keyCode : event.which &#63; event.which : event.charCode;

if (Code == 13) //可以自行加其它过滤条件
{
for(var i=0;i<inputs.length;i++)
{
if(inputs[i].id == document.activeElement.id)
{ 
i = i== (inputs.length - 1) &#63; -1 : i ;
$('#'+ inputs[i+1].id ).focus()
break;
}
}
}
}
</script>

그 중 IE와 Firefox는 키값을 다르게 얻기 때문에 브라우저에서 간단하게 판단을 합니다. 이렇게 하면 각 브라우저에서 적중한 키 값을 얻을 수 있습니다.

마지막으로 현재 값을 얻은 후 다양한 다른 조건을 추가할 수 있습니다.