> 웹 프론트엔드 > JS 튜토리얼 > Jquery는 주요 브라우저와 호환되는 Enter로 입력 포커스를 전환하는 방법을 구현합니다_jquery

Jquery는 주요 브라우저와 호환되는 Enter로 입력 포커스를 전환하는 방법을 구현합니다_jquery

WBOY
풀어 주다: 2016-05-16 16:38:19
원래의
1294명이 탐색했습니다.

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

첫 번째 아이디어는 온라인에서 코드를 복사하여 직접 사용하는 것입니다. 하지만 바이두와 구글에서 검색한 결과 발견된 코드의 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는 키 값을 다르게 얻기 때문에 브라우저에서 간단한 판단이 이루어집니다. 이렇게 하면 각 브라우저에서 적중한 키 값을 얻을 수 있습니다.

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

데모 주소: http://demo.jb51.net/js/2014/jsenterqiehuan/

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿