[태그:] 검색창 포커스

포털의 검색결과 페이지에서는 키보드 입력시
자동으로 검색창에 포커스가 가게 되어 빠르게 검색할 수 있도록 하고 있습니다.
이와 같은 기능을 jQuery 로 구현해봤습니다.

(수정 110525 : 붙여넣기(Ctrl+V) 시 검색창에 붙여넣기 되도록 추가)

$(document).ready(function() {
    var target_input = $('#keyword'); // 포커스 인풋
    var chk_short = true;

    $(document).bind("keydown keyup", function(e) {
        var key = e.keyCode;
        var tg = e.target;
        if(tg.tagName == "INPUT" ||  tg.tagName == "TEXTAREA") return true;
        
        var specific = key >= 8 && key <= 46;
        if(e.type == "keydown") {
            if(specific) {
                chk_short = false;
                return true;
            }
            if(!specific && chk_short) {
                target_input.focus().select();
                //target_input.focus().select(); return false;
            }
            if(e.ctrlKey && e.keyCode == 86){
                target_input.focus().select();
            }
        } else {
            if(specific) {
                chk_short = true;
            }
        }
    });
    
    $("input, textarea").bind("blur", function() {
        chk_short = true;
    });
});

이렇게 하면 현재 포털사이트들과 같은 동작을 합니다.

이 상태로는 영어단어를 빠르게 검색할때 편리하며 주로 한글단어로 검색하는 경우엔
target_input.focus().select(); 부분을
target_input.focus().select(); return false; 으로 바꿔서 쓰는 것이 사용성이 좋을 것입니다.