HTML DOM 클립보드 이벤트-HTML 튜토리얼-php.cn

HTML DOM 클립보드 이벤트

王林

풀어 주다： 2023-09-23 16:13:01

앞으로

1014명이 탐색했습니다.

HTML DOM 클립보드 이벤트는 클립보드 수정에 대한 정보를 제공하는 데 사용됩니다. 이벤트는 잘라내기, 복사, 붙여넣기가 가능합니다. 클립보드 이벤트를 사용하면 클립보드가 어떻게 수정되었는지에 대한 정보를 사용자에게 제공하여 웹사이트의 접근성을 높일 수 있습니다.

Properties

다음은 클립보드 이벤트의 속성입니다. −

Property	Description
clipboardData	클립보드 작업(잘라내기, 복사 또는 붙여넣기)의 영향을 받은 데이터가 포함된 개체를 반환합니다. ).

Event

다음은 클립보드 이벤트에 속하는 이벤트 유형입니다. 요소.

Oncut이 이벤트는 사용자가 요소의 콘텐츠를 잘라낼 때 트리거됩니다. onpaste이 이벤트는 사용자가 요소에 일부 콘텐츠를 붙여넣을 때 트리거됩니다. Syntax

var clipboardEvent = new ClipboardEvent(type,[options]);

로그인 후 복사

Example

<!DOCTYPE html>
<html>
<body>
<form>
<label> TEXTBOX <input type="text" oncopy="CopyText()" value="Copy this text">
</label>
</form>
<p id="Sample"></p>
<script>
   function CopyText() {
      document.getElementById("Sample").innerHTML = "The text has been copied by you!"
   }
</script>
</body>
</html>

로그인 후 복사

이렇게 하면 다음과 같은 출력이 생성됩니다−



클립보드 이벤트 구문은 다음과 같습니다 -	여기서 type은 'cut', 'copy', 'paste'가 가능하며, 두 번째 인자는 선택사항입니다. 두 번째 매개변수에는 ClipboardData, dataType 및 데이터가 포함됩니다.
복사 시 클립보드 이벤트 중 하나의 예를 살펴보겠습니다.	Output

TEXTBOX 내부의 텍스트를 복사하는 동안−

위의 예에서 −

텍스트 유형의 요소를 생성합니다. 여기에는 TEXTBOX 태그가 할당되어 있으며 사용자가 선택할 수 있는 일부 텍스트가 이미 포함되어 있습니다. 사용자가 텍스트를 복사한 후 CopyText() 메서드가 실행됩니다.

<label> TEXTBOX <input type="text" oncopy="CopyText()" value="Copy this text">

로그인 후 복사

CopyText() 메서드는 문서의 getElementById() 메서드를 사용하여

요소를 가져오고 "문단 내부에 텍스트를 복사했습니다!"라고 표시합니다.

rreee

위 내용은 HTML DOM 클립보드 이벤트의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!