Programing

jQuery : 텍스트 상자 내에서 Tab 키 누르기를 캡처하는 방법

lottogame 2020. 6. 22. 07:51
반응형

jQuery : 텍스트 상자 내에서 Tab 키 누르기를 캡처하는 방법


Tab 키 누르기를 캡처하고 기본 작업을 취소하고 내 자신의 자바 스크립트 함수를 호출하고 싶습니다.


편집 : 요소가 동적으로 삽입 되므로 예제와 같이 위임on() 을 사용해야 하지만 @Marc 주석과 같이 IE에서 키 누르기 이벤트는 문자가 아닌 키를 캡처하지 않기 때문에 키 다운 이벤트에 바인딩해야합니다.

$("#parentOfTextbox").on('keydown', '#textbox', function(e) { 
  var keyCode = e.keyCode || e.which; 

  if (keyCode == 9) { 
    e.preventDefault(); 
    // call custom function here
  } 
});

예를 확인 하십시오 .


jQuery 1.9의 실제 예제 :

$('body').on('keydown', '#textbox', function(e) {
    if (e.which == 9) {
        e.preventDefault();
        // do your code
    }
});

$('#textbox').live('keypress', function(e) {
    if (e.keyCode === 9) {
        e.preventDefault();
        // do work
    }
});

위의 표시된 방법이 저에게 효과가 없었습니다. 비트 오래된 jquery를 사용하고있을 수 있습니다. 마지막으로 아래에 표시된 코드 스 니펫이 작동합니다-누군가가 같은 위치에있는 경우 게시

$('#textBox').live('keydown', function(e) {
    if (e.keyCode == 9) {
        e.preventDefault();
        alert('tab');
    }
});

탭에서 키 다운을 사용하는 중요한 부분은 탭이 항상 이미 무언가를 시도한다는 것을 알고 있다는 것입니다. 마지막에 "거짓을 반환"하는 것을 잊지 마십시오.

여기 내가 한 일이 있습니다. .blur에서 실행되는 기능과 양식 포커스가있는 위치를 바꾸는 기능이 있습니다. 기본적으로 양식의 끝에 입력을 추가하고 흐림 계산을 실행하는 동안 이동합니다.

$(this).children('input[type=text]').blur(timeEntered).keydown(function (e) {
        var code = e.keyCode || e.which;
        if (code == "9") {
            window.tabPressed = true;
            // Here is the external function you want to call, let your external
            // function handle all your custom code, then return false to
            // prevent the tab button from doing whatever it would naturally do.
            focusShift($(this));
            return false;
        } else {
            window.tabPressed = false;
        }
        // This is the code i want to execute, it might be different than yours
        function focusShift(trigger) {
            var focalPoint = false;
            if (tabPressed == true) {
                console.log($(trigger).parents("td").next("td"));
                focalPoint = $(trigger).parents("td").next("td");

            }
            if (focalPoint) {
                $(focalPoint).trigger("click");
            }
        }
    });

이 시도:

$('#contra').focusout(function (){
    $('#btnPassword').focus();
});

ID가 txtName 인 TextBox가 있다고 가정합니다.

$("[id*=txtName]").on('keydown', function(e) { 
  var keyCode = e.keyCode || e.which; 
  if (keyCode == 9) {
     e.preventDefault();
     alert('Tab Pressed');
 }
}); 

JQuery API를 사용하여 이벤트 탭을 캡처 할 수 있습니다 .

$( "#yourInputTextId" ).keydown(function(evt) {
   if(evt.key === "Tab")
      //call your function
});

이것은 나를 위해 일했다 :

$("[id*=txtName]").on('keydown', function(e) { var keyCode = e.keyCode || e.which; if (keyCode == 9) { e.preventDefault(); alert('Tab Pressed'); } });

참고 URL : https://stackoverflow.com/questions/1314450/jquery-how-to-capture-the-tab-keypress-within-a-textbox

반응형