2012-03-13 4 views
5
events: { "paste .youtube-url" : "addUrl" } 

addUrl: function(){ 
    console.log(this.$(".youtube-url").val()); 

그래서 내가 먼저 텍스트 상자 시간에 "나쁜"붙여 넣기 말할 수붙여 넣기 이벤트가 발생됩니다

콘솔 출력 : (빈 문자열) 내가 붙여 넣으면 다음

대신 나쁜

: "코더"

콘솔 출력 같은 것을 추가 "badcoder"상자 안에 무엇이 들어 있는지, 나는 텍스트가 삽입되기 전에 가상 붙여 넣기 이벤트가 시작 되었기 때문에이 것 같아요.

답변

8

paste 이벤트를 사용하는 대신 누군가가 붙여 넣을 때 발생하지만 입력 값이 업데이트 된 후에 만 ​​발생하는 keyup 이벤트를 사용할 수 있습니다.

UPDATE @Micah (및 @JohnnyO)에서

좋은 코멘트. 여기에 내가 일을하는 것으로 수정입니다 : 입력 값을 읽는 코드 만했다 스택의 나머지 코드 실행 후 실행되도록

$('input').on('paste', function() { 
    var that = this; 
    setTimeout(function() { 
     alert(that.value); 
    }, 0); 
});​ 

이는 시간 제한을 설정합니다. Chrome 21에서 테스트 한 적이 있지만 제로 타임 아웃이 트릭을 수행하는 것으로 보입니다.

데모 : http://jsfiddle.net/H4K4R/

+1

참고 : #JohnnyO는 컨텍스트 메뉴를 붙여 넣을 때'keyup' 이벤트가 발생하지 않는다고 말합니다. – Micah

+0

@Micah 잘 잡으세요. 나는 ** 다른 대답으로 ** 나의 대답을 업데이트했다. – Jasper

+0

'events : { "change .youtube-url": "addUrl"}'은 다른 옵션 일 수 있지만 포커스가 텍스트 상자를 벗어날 때까지 이벤트는 실행되지 않습니다. – Micah

4

@Jasper에 의한 대답은 키보드로 할 때 붙여 넣기 작동합니다. 마우스와 상황에 맞는 메뉴를 붙여 붙여 넣을 때 키 업 이벤트가 발생하지 않습니다. 주목해야 할 가장 좋은 이벤트는 '입력'이벤트입니다. 불행히도, 9 이전의 IE 버전에서는 'inputchange'를 지원하지 않기 때문에 'propertychange'이벤트를 감시해야합니다. 'propertychange'는 거품이 나지 않으므로 백본을 사용하는 것처럼이 이벤트를 연결할 수 없으며 대신 '.youtube-url'요소에 직접 바인딩해야합니다.