복붙노트

[JQUERY] jQuery를 "입력"이벤트

JQUERY

jQuery를 "입력"이벤트

해결법


  1. 1.의 keyup 키가 (: keyUp 이벤트를 트리거 Control 키를 해제 한 후 눌러 예를 들어) 아무것도하지 않는 경우에도 발생하기 때문에 그것은의 keyup에 매우 별칭이 아니다.

    의 keyup 키가 (: keyUp 이벤트를 트리거 Control 키를 해제 한 후 눌러 예를 들어) 아무것도하지 않는 경우에도 발생하기 때문에 그것은의 keyup에 매우 별칭이 아니다.

    그것에 대해 생각하는 좋은 방법은 다음과 같이이다 : 그것은 그 트리거 할 때마다 입력 변경 이벤트입니다. 입력 수정 눌러 키 (이벤트를 트리거하지 않습니다 자체 때문에, 예를 들어, Ctrl 키를하지만, Ctrl 키-V는 텍스트 것 붙여 넣기) 자동 완성 옵션을 선택, - 이것은 포함 - 이에 제한되지 않음 리눅스 스타일, 붙여 넣기 드래그 앤 드롭, 그리고 다른 많은 것들을 마우스 가운데 버튼을 클릭.

    이 페이지 및 자세한 내용은이 대답에 주석을 참조하십시오.


  2. 2.oninput 이벤트는 입력 필드의 변경 사항을 추적하는 것은 매우 유용합니다.

    oninput 이벤트는 입력 필드의 변경 사항을 추적하는 것은 매우 유용합니다.

    그러나이 IE 버전에서 지원되지 않습니다 <9 그러나 오래된 IE 버전 oninput 같은 않는 독자적인 이벤트 onpropertychange 있습니다.

    당신은이 방법을 사용할 수 있습니다 :

    $(':input').on('input propertychange');
    

    전체 crossbrowser 지원을합니다.

    의 PropertyChange가 어떠한 속성 변화를 촉발 할 수 있기 때문에, 예를 들어, 장애인 속성은 다음이 포함하고 싶은, 변경 :

    $(':input').on('propertychange input', function (e) {
        var valueChanged = false;
    
        if (e.type=='propertychange') {
            valueChanged = e.originalEvent.propertyName=='value';
        } else {
            valueChanged = true;
        }
        if (valueChanged) {
            /* Code goes here */
        }
    });
    

  3. 3.jQuery를 사용하여, 다음은 효과가 동일하다 :

    jQuery를 사용하여, 다음은 효과가 동일하다 :

    $('a').click(function(){ doSomething(); });
    $('a').on('click', function(){ doSomething(); });
    

    입력 이벤트로, 단, 두 번째 패턴은 제가 테스트 한 브라우저에서 작동하는 것 같다.

    따라서, 당신은 일이를 기대하지만 (현재 적어도)하지 않습니다

    $(':text').input(function(){ doSomething(); });
    

    다시 말하지만, 당신이 활용 이벤트 위임을 원하는 경우 (예를 들어, 당신의 input.text가 DOM에 추가되기 전에 #container에 이벤트를 설정)이 마음에 와서해야합니다 :

    $('#container').on('input', ':text', function(){ doSomething(); });
    

    슬프게도, 다시, 그것은 현재 작동하지 않습니다!

    단지이 패턴은 작동합니다 :

    $(':text').on('input', function(){ doSomething(); });
    

    EDITED 함께 최신 정보

    나는 확실히이 패턴을 확인할 수 있습니다 :

    $('#container').on('input', ':text', function(){ doSomething(); });
    

    이제 모든 '표준'브라우저에서, 또한 작동합니다.


  4. 4.claustrofob 말했듯이, oninput IE9 + 지원됩니다.

    claustrofob 말했듯이, oninput IE9 + 지원됩니다.

    그러나, "이벤트 oninput 문자는 문자가 삽입 된 경우에만 사용자 인터페이스를 통해 텍스트 필드에서 삭제됩니다 때 해고되지 않은 인터넷 익스플로러 9의 버그입니다. onpropertychange 이벤트가 유사 익스플로러 9 인터넷에서 지원되지만 있지만 이벤트 oninput, 그것은 삭제에 해고되지 않고, 또한 버그입니다.

    문자가 여러 가지 방법 (백 스페이스 및 삭제 키, CTRL + X, 잘라 내기 및 상황에 맞는 메뉴에서 삭제 명령)에서 삭제 될 수 있기 때문에, 모든 변경 사항을 감지하는 좋은 솔루션은 존재하지 않는다. 문자가 컨텍스트 메뉴의 삭제 명령에 의해 삭제 된 경우, 수정은 "인터넷 익스플로러 9에서 자바 스크립트를 검출 할 수 없다

    (백 스페이스 키를 누른 상태에서 IE에 불을하려는 경우, 및를 keyDown) I는 입력의 keyup 모두에 결합하는 좋은 결과가있다.


  5. 5.INPUT을 사용하는 동안주의해야합니다. 이 이벤트는 초점과 IE 11에서 흐림에 발생하지만 다른 브라우저의 변화에 ​​트리거됩니다.

    INPUT을 사용하는 동안주의해야합니다. 이 이벤트는 초점과 IE 11에서 흐림에 발생하지만 다른 브라우저의 변화에 ​​트리거됩니다.

    https://connect.microsoft.com/IE/feedback/details/810538/ie-11-fires-input-event-on-focus


  6. 6.나는 '입력'단순히 여기에 DOM 레벨 O 이벤트 모델에서하는 'oninput'같은 방식으로 작동합니다 생각합니다.

    나는 '입력'단순히 여기에 DOM 레벨 O 이벤트 모델에서하는 'oninput'같은 방식으로 작동합니다 생각합니다.

    덧붙여 :

    silkfire가 댓글을 달았습니다 것처럼, 나도 'jQuery를 입력 이벤트'에 대한 인터넷 검색. 따라서 여기에지도하고 '입력'을 배울 매우 놀랐다 jQuery의 결합 () 명령에 허용되는 매개 변수입니다. 액션 jQuery에에서 (p. 102, 2008 에드.) '입력'( '흐림'에서 '언로드'에서, 20 개 등) 가능한 이벤트로 했나요 아니다. 이 페이지에 그 사실이다. 92는 반대로 (즉 레벨 0, 레벨 2 모델 사이에 다른 문자열 식별자 참조부터) 다시 읽기로부터 추측 될 수있다. 확실히 그것은 잘못된 것입니다.


  7. 7.JQuery와 다음은 CSTE 연구진에 대한 서명 () 메소드를 갖는다 : CSTE 연구진을 (일정 [선택기], 데이터, 핸들러)

    JQuery와 다음은 CSTE 연구진에 대한 서명 () 메소드를 갖는다 : CSTE 연구진을 (일정 [선택기], 데이터, 핸들러)

    이벤트는이 참조에 나와있는 것들 중 누구라도 될 수있다 :

    https://developer.mozilla.org/en-US/docs/Web/Events

    비록, 그들은 모두 모든 브라우저에서 지원되지 않습니다.

    모질라는 입력 이벤트에 대한 다음 상태 :


  8. 8.

    $("input#myId").bind('keyup', function (e) {    
        // Do Stuff
    });
    

    모두 IE와 크롬에서 작업

  9. from https://stackoverflow.com/questions/17384218/jquery-input-event by cc-by-sa and MIT license