2011-11-19 1 views
23

의 붙여 넣기 이벤트를 감지합니다. 붙여 넣기 이벤트를 감지하고 붙여 넣기를 방지하여 텍스트를 포함하도록 붙여 넣기를 가로 채고 위생 처리 할 수 ​​있습니까?콘텐츠 수정 가능 div가있는 콘텐츠 수정 가능 항목

붙여 넣기 + 위생 처리가 완료된 후에도 초점을 잃고 싶지는 않습니다.

아이디어가 있으십니까? 감사합니다

+1

것이 무엇 유용한 기능은 붙여 넣기 이벤트가 발생하기 전에이를 캡처하고 위생 처리 한 다음 커서 위치를 잃지 않고 내용을 편집 할 수있는 안전한 내용을 주입하는 기금입니다. 아이디어? –

+1

IE, Safari 및 Chrome에서는 클립 보드의 데이터에 액세스 할 수 있지만 Firefox의 해결 방법은 큰 어려움을 겪어야합니다. 가능하다면 붙여 넣기를 허용 한 다음 사실 이후에 전체 요소의 내용을 살균하는 것이 훨씬 쉽습니다. 그게 효과가 있니? – sdleihssirhc

+0

이전에 게시 한 해킹 방법이 있습니다. http://stackoverflow.com/questions/2176861/javascript-get-clipboard-data-on-paste-event-cross-browser/2177059#2177059, http : //stackoverflow.com/questions/4365833/how-can-i-get-the-text-that-is-going-to-be-pasted-in-my-html-text-editor/4365862#4365862 –

답변

20

UPDATE :

모든 주요 브라우저는 이제 paste 이벤트에 클립 보드 데이터에 대한 액세스를 제공합니다. 최신 브라우저에 대한 예는 Nico Burns's answer을 참조하고 구형 브라우저를 지원해야하는 경우 Tim Down's answer을 확인하십시오.


div에서 onPaste 이벤트를 수신하여 붙여 넣기를 감지 할 수 있습니다. 붙여 넣기를 비활성화하려면 해당 청취자로부터 event.preventDefault()으로 전화하십시오.

붙여 넣은 콘텐츠를 캡처하는 데는 다소 어려움이 있습니다. onPaste 이벤트는 붙여 넣은 콘텐츠에 대한 액세스 권한을 부여하지 않기 때문입니다. 이 방문자에게 이것에 초점이을 div에

  • 이동 볼 수없는, 그래서

    • 는 더미 사업부를 만들고 창 경계 외부에 배치 :이 처리하는 일반적인 방법은 상기 onPaste 이벤트 처리기에서 다음을 수행하는 것입니다
    • 전화 발신 setTimeout(sanitize, 0)

    하고 살균 방법에서 사용하여 소독 방법 :

    • 원래 사업부의 살균 내용을 삽입 더미 DIV를 찾아
    • 는 HTML을 소독는 내용의 취득 원래 사업부
    • 로 다시 DIV에게
    • 이동 초점을 제거
  • +1

    'paste '이벤트가 너무 늦어서 일부 브라우저에서는 이런 종류의 리디렉션을 할 수 없지만 일반적인 아이디어는 작동합니다. –

    +2

    다음은 크로스 브라우저에서 테스트 한 또 다른 인기있는 솔루션입니다. http://stackoverflow.com/questions/2176861/javascript-get-clipboard-data-on-paste-event-cross-browser – yoshyosh