oncopy 이벤트
정의와 사용법
oncopy 이벤트는 사용자가 요소 내용을 복사할 때 발생합니다.
힌트:사용자가 <img> 요소로 생성된 요소(예: 이미지)를 복사할 때도 oncopy 이벤트가 발생합니다.
힌트: oncopy 이벤트는 type="text"의 <input> 요소에 주로 사용됩니다.
힌트:요소/요소 내용을 복사하는 세 가지 방법은 다음과 같습니다:
- CTRL + C
- 브라우저의 편집 메뉴에서 복사를 선택합니다
- 오른쪽 클릭 메뉴에서 복사 명령을 선택합니다
예제
예제 1
<input> 요소의 텍스트를 복사할 때 JavaScript를 실행합니다:
<input type="text" oncopy="myFunction()" value="이 텍스트를 복사해 보세요">
예제 2
<p> 요소의 일부 텍스트를 복사할 때 JavaScript를 실행합니다:
<p oncopy="myFunction()">이 텍스트를 복사해 보세요</p>
예제 3
이미지를 복사할 때 JavaScript를 실행합니다:
<img src="codew3c.gif" oncopy="myFunction()">
문법
HTML에서:
<element oncopy="myScript">
JavaScript에서:
object.oncopy = function(){myScript};
JavaScript에서 addEventListener() 메서드를 사용하여:
object.addEventListener("copy", myScript);
주의사항:Internet Explorer 8 이상 버전에서 지원되지 않습니다 addEventListener() 메서드。
기술 세부 사항
| 버블링: | 지원 |
|---|---|
| 취소 가능: | 지원 |
| 이벤트 유형: | ClipboardEvent |
| 지원되는 HTML 태그: | 모든 HTML 요소 |
브라우저 지원
| 이벤트 | Chrome | IE | 파이어폭스 | 사파리 | 오페라 |
|---|---|---|---|---|---|
| oncopy | 지원 | 지원 | 지원 | 지원 | 지원 |
주의사항:이미지를 복사하려고 시도할 때, oncopy 이벤트가 일부 브라우저에서 예상대로 작동하지 않을 수 있습니다. 아래의 더 많은 예제를 참조하세요.
