웹 페이지에서 텍스트 선택, 잘라내기, 복사, 붙여넣기 및 마우스 오른쪽 버튼 클릭을 비활성화하는 방법

웹 페이지에서 텍스트 선택, 잘라내기, 복사, 붙여넣기 및 마우스 오른쪽 버튼 클릭을 비활성화하는 방법

다른 사람이 웹사이트에서 콘텐츠를 훔치는 것을 방지하려면 CSS, JavaScript 및 jQuery를 사용하여 어느 정도 방지할 수 있습니다. 이 기사에서는 웹 페이지에서 텍스트 선택, 잘라내기, 복사, 붙여넣기 및 마우스 오른쪽 버튼 클릭을 비활성화하는 방법을 배웁니다.





CSS 또는 JavaScript를 사용하여 텍스트 선택 비활성화

CSS, JavaScript 또는 jQuery를 사용하여 전체 웹 페이지 또는 페이지 일부의 텍스트 선택을 비활성화할 수 있습니다.





Windows 10에서 오래된 PC 게임을 플레이하는 방법

JavaScript를 사용하여 전체 웹 페이지의 텍스트 선택을 비활성화하는 방법

사용하다 온마우스다운 그리고 onselectstart 이벤트 속성 신체 태그를 사용하여 전체 웹 페이지의 텍스트 선택을 비활성화합니다. 이러한 이벤트는 브라우저의 기본 동작을 재정의합니다.









This is the title of the web page



Founded in 2007, MUO has grown into one of the largest online technology publications on the web.
Our expertise in all things tech has resulted in millions of visitors every month and hundreds of thousands of fans on social media.
We believe that technology is only as useful as the one who uses it.
Our aim is to equip readers like you with the know-how to make the most of today's tech, explained in simple terms that anyone can understand.
We also encourage readers to use tech in productive and meaningful ways.


JavaScript를 사용하여 웹 페이지의 일부 텍스트 선택을 비활성화하는 방법

사용하다 온마우스다운 그리고 onselectstart 이벤트 속성 HTML 텍스트 선택을 비활성화하려는 태그에 태그를 지정합니다. 아래 예에서는 두 번째에 대해 텍스트 선택이 비활성화되어 있습니다. div 꼬리표.





This is the title of the web page



Text selection is enabled for this text.


Text selection is disabled for this text.


CSS를 사용하여 전체 웹 페이지의 텍스트 선택을 비활성화하는 방법

사용 사용자 선택 CSS 속성 신체 태그를 사용하여 전체 웹 페이지의 텍스트 선택을 비활성화합니다. 일부 브라우저의 경우 확장 프로그램을 추가해야 합니다. 사용자 선택 . 다음은 모든 브라우저의 전체 속성 목록입니다.



  • 크롬 , 오페라 : 사용자 선택
  • 원정 여행 : -webkit-user-select
  • 모질라 : -moz-user-select
  • IE 10 이상 : -ms-사용자 선택

텍스트 선택을 비활성화하려면 이러한 모든 속성을 없음으로 설정해야 합니다.





This is the title of the web page

body {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}




Founded in 2007, MUO has grown into one of the largest online technology publications on the web.
Our expertise in all things tech has resulted in millions of visitors every month and hundreds of thousands of fans on social media.
We believe that technology is only as useful as the one who uses it.
Our aim is to equip readers like you with the know-how to make the most of today's tech, explained in simple terms that anyone can understand.
We also encourage readers to use tech in productive and meaningful ways.


CSS를 사용하여 웹 페이지의 일부 텍스트 선택을 비활성화하는 방법

사용하다 사용자 선택 CSS 속성 HTML 텍스트 선택을 비활성화하려는 태그에 태그를 지정합니다. 클래스 또는 ID를 사용하여 이러한 HTML 요소를 대상으로 지정할 수 있습니다. 아래 예에서는 두 번째에 대해 텍스트 선택이 비활성화되어 있습니다. div 꼬리표. 여기서 class는 두 번째 div를 대상으로 하는 데 사용됩니다.





관련된: 10분 안에 배울 수 있는 10가지 간단한 CSS 코드 예제





This is the title of the web page

.disable-text-selection {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}




Text selection is enabled for this text.


Text selection is disabled for this text.


JavaScript를 사용하여 잘라내기, 복사 및 붙여넣기를 비활성화하는 방법

다음을 사용하여 잘라내기, 복사 및 붙여넣기를 비활성화할 수 있습니다. 온컷 , 온카피 , 그리고 붙이다 대상 HTML 요소가 있는 이벤트 속성. 전체 웹 페이지에 대해 잘라내기, 복사 및 붙여넣기를 비활성화하려면 본문 태그와 함께 이러한 이벤트 속성을 사용해야 합니다. 다음을 사용하여 끌어서 놓기를 비활성화할 수도 있습니다. 온드래그 그리고 온드롭 이벤트 속성. 아래 예에서는 입력 태그에 대해 잘라내기, 복사, 붙여넣기, 끌어서 놓기가 비활성화되어 있습니다.





관련된: JavaScript란 무엇이며 어떻게 작동합니까?





This is the title of the web page



Cut, Copy, and Paste is disabled for the below input element.

type='text'
onselectstart='return false'
oncut='return false'
oncopy='return false'
onpaste='return false'
ondrag='return false'
ondrop='return false'
/>

jQuery를 사용하여 잘라내기, 복사 및 붙여넣기를 비활성화하는 방법

jQuery를 사용하여 웹 페이지에서 잘라내기, 복사 및 붙여넣기를 비활성화할 수 있습니다. 묶다() 기능. 에서 묶다() 기능을 사용하려면 사용자가 웹 페이지에서 무엇이든 잘라내기, 복사 또는 붙여넣기를 시도할 때 발생하는 잘라내기, 복사 및 붙여넣기 이벤트를 지정해야 합니다. 로드할 헤드 섹션에 스크립트 태그를 포함해야 합니다. 제이쿼리 그것을 사용하기 전에.

관련된: jQuery에서 요소를 만드는 방법 알아보기





This is the title of the web page




Cut, Copy, and Paste is disabled for the complete web page.



$(document).ready(function() {
$('body').bind('cut copy paste', function(event) {
event.preventDefault();
});
});


JavaScript를 사용하여 웹 페이지에서 오른쪽 클릭을 비활성화하는 방법

다음을 사용하여 웹 페이지에서 마우스 오른쪽 버튼 클릭을 비활성화할 수 있습니다. 상황에 맞는 메뉴 이벤트 처리기에 '거짓 반환'을 포함합니다.





This is the title of the web page



Right Click is disabled for the complete web page.


document.oncontextmenu = new Function('return false');


jQuery를 사용하여 웹 페이지에서 마우스 오른쪽 버튼 클릭을 비활성화하는 방법

다음을 사용하여 웹 페이지에서 마우스 오른쪽 버튼 클릭을 비활성화할 수 있습니다. 컨텍스트 메뉴 이벤트.





This is the title of the web page




Right Click is disabled for the complete web page.


$(document).bind('contextmenu',function(e){
return false;
});


사이버 범죄자로부터 웹사이트 보호

사이버 범죄자는 가능한 모든 도구를 사용하여 데이터를 훔치거나 웹사이트를 스팸하거나 보호된 페이지에서 민감한 정보를 해킹합니다. 이를 방지하기 위해 웹사이트에 보안 계층을 포함하는 것이 필수적입니다. 스팸 웹 사이트 양식은 오늘날 가장 일반적인 공격 중 하나입니다. 이러한 스팸 공격을 방지하려면 웹사이트 양식에 CAPTCHA 유효성 검사를 추가하십시오.

조이콘을 안드로이드에 연결하는 방법
공유하다 공유하다 트위터 이메일 HTML, CSS 및 JavaScript를 사용하여 CAPTCHA 유효성 검사 양식 만들기

CAPTCHA 인증으로 웹사이트를 보호하세요.

다음 읽기
관련 항목
  • 프로그램 작성
  • 웹 개발
  • 제이쿼리
  • CSS
저자 소개 유브라지 찬드라(60편 게재)

Yuvraj는 인도 델리 대학교의 컴퓨터 공학 학부생입니다. 그는 풀 스택 웹 개발에 열정적입니다. 그는 글을 쓰지 않을 때 다양한 기술의 깊이를 탐구하고 있습니다.

유브라지 찬드라가 참여한 작품 더보기

뉴스레터 구독

기술 팁, 리뷰, 무료 전자책 및 독점 거래에 대한 뉴스레터에 가입하십시오!

구독하려면 여기를 클릭하세요.