자바스크립트를 이용하여 Ctrl+V, Ctrl+C를 검출하는 방법?

자바스크립트를 이용하여 Ctrl+V, Ctrl+C를 검출하는 방법?

자바스크립트를 이용하여 +,V +C를 검출하는 방법?

텍스트 영역에 붙여넣기를 제한해야 합니다. 최종 사용자는 내용을 복사하여 붙여넣으면 안 되고, 사용자는 텍스트 영역에만 텍스트를 입력해야 합니다.

어떻게 하면 이것을 이룰 수 있을까요?

그냥 흥미로 한 거예요.옳은 일이 아니라는 것에는 동의하지만, 제 생각에는 수술관의 결정이 되어야 할 것 같습니다.또한 코드를 쉽게 확장하여 기능을 추가할 수 있습니다(고급 클립보드 또는 S+ 서버측 저장 트리거).

$(document).ready(function() {
    var ctrlDown = false,
        ctrlKey = 17,
        cmdKey = 91,
        vKey = 86,
        cKey = 67;

    $(document).keydown(function(e) {
        if (e.keyCode == ctrlKey || e.keyCode == cmdKey) ctrlDown = true;
    }).keyup(function(e) {
        if (e.keyCode == ctrlKey || e.keyCode == cmdKey) ctrlDown = false;
    });

    $(".no-copy-paste").keydown(function(e) {
        if (ctrlDown && (e.keyCode == vKey || e.keyCode == cKey)) return false;
    });
    
    // Document Ctrl + C/V 
    $(document).keydown(function(e) {
        if (ctrlDown && (e.keyCode == cKey)) console.log("Document catch Ctrl+C");
        if (ctrlDown && (e.keyCode == vKey)) console.log("Document catch Ctrl+V");
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h3>Ctrl+c Ctrl+v disabled</h3>
<textarea class="no-copy-paste"></textarea>
<br><br>
<h3>Ctrl+c Ctrl+v allowed</h3>
<textarea></textarea>

또한 이 스크립트는 jQuery 라이브러리를 필요로 합니다.

코데펜 데모

EDIT: 3개의 중복 라인을 제거했습니다(관련).팀 다운의 제안 덕분에 (댓글 참조)

EDIT: Mac 지원 추가(대신 키)CMD

jquery를 사용하면 함수를 바인딩하여 복사, 붙여넣기 등을 쉽게 탐지할 수 있습니다.

$("#textA").bind('copy', function() {
    $('span').text('copy behaviour detected!')
}); 
$("#textA").bind('paste', function() {
    $('span').text('paste behaviour detected!')
}); 
$("#textA").bind('cut', function() {
    $('span').text('cut behaviour detected!')
});

자세한 내용은 여기: http://www.mkyong.com/jquery/how-to-detect-copy-paste-and-cut-behavior-with-jquery/

불법 복제 방지 조치로 사용되는 것은 귀찮지만, 합법적인 경우가 있을 수 있다는 것을 알 수 있기 때문에 따르면 다음과 같습니다.

function disableCopyPaste(elm) {
    // Disable cut/copy/paste key events
    elm.onkeydown = interceptKeys

    // Disable right click events
    elm.oncontextmenu = function() {
        return false
    }
}

function interceptKeys(evt) {
    evt = evt||window.event // IE support
    var c = evt.keyCode
    var ctrlDown = evt.ctrlKey||evt.metaKey // Mac support

    // Check for Alt+Gr (http://en.wikipedia.org/wiki/AltGr_key)
    if (ctrlDown && evt.altKey) return true

    // Check for ctrl+c, v and x
    else if (ctrlDown && c==67) return false // c
    else if (ctrlDown && c==86) return false // v
    else if (ctrlDown && c==88) return false // x

    // Otherwise allow
    return true
}

사용했습니다.event.ctrlKeyMac OS X의 대부분의 브라우저처럼 키 코드를 확인하는 것이 아니라 / Alt"다운" 및 "업" 이벤트가 트리거되지 않으므로 다음을 사용하는 것이 탐지할 수 있는 유일한 방법입니다.event.ctrlKey예를 들어 키를 누른 후 c 이벤트에서.저도 대체했습니다.ctrlKey와 함께metaKey

이 방법의 한계:

• 오른쪽 을 클릭한 이벤트Opera 에서를(를) 할 수

• 브라우저 창 사이의 드래그 앤 드롭은 내가 아는 한 막을 수 없습니다.

• edit->copy메뉴 항목(예: 를 계속 할 수 .Firefox에서는 복사/붙여넣기를 계속 허용할 수 있습니다.

• 키보드 레이아웃/로컬이 다른 사용자의 경우 복사/붙여넣기/자르기가 동일한 키 코드라는 보장도 없지만(레이아웃이 영어와 동일한 표준을 따르는 경우가 많지만), 포괄적인 "모든 제어 키 사용 안 함"은 모든 선택 등도 사용 안 함을 의미하므로 이를 절충해야 한다고 생각합니다.

을 하시면.ctrlKey재산, 상태를 유지할 필요는 없습니다.

   $(document).keydown(function(event) {
      // Ctrl+C or Cmd+C pressed?
      if ((event.ctrlKey || event.metaKey) && event.keyCode == 67) {
         // Do stuff.
      }

      // Ctrl+V or Cmd+V pressed?
      if ((event.ctrlKey || event.metaKey) && event.keyCode == 86) {
         // Do stuff.
      }

      // Ctrl+X or Cmd+X pressed?
      if ((event.ctrlKey || event.metaKey) && event.keyCode == 88) {
         // Do stuff.
      } 
    }

또 이 있습니다.입니다. onpaste,oncopy그리고.oncutIE, Firefox, Chrome, Safari에서 이벤트를 등록하고 취소할 수 있으며(몇 가지 사소한 문제가 있음), 이러한 이벤트를 취소할 수 없는 유일한 주요 브라우저는 Opera입니다.

제 다른 답변에서 볼 수 있듯이 +V와 C+를 가로채는 것은 많은 부작용을 수반하며, 여전히 사용자가 Firefox를 사용하여 붙여넣기 하는 것을 막지 못합니다.Edit등

function disable_cutcopypaste(e) {
    var fn = function(evt) {
        // IE-specific lines
        evt = evt||window.event
        evt.returnValue = false
        
        // Other browser support
        if (evt.preventDefault) 
            evt.preventDefault()
        return false
    }
    e.onbeforepaste = e.onbeforecopy = e.onbeforecut = fn
    e.onpaste = e.oncopy = e.oncut = fn
}

사파리는 여전히 이 방법에 약간의 문제가 있지만(기본값을 방지할 때 잘라내기/복사하기 대신 클립보드를 지웁니다), 그 버그는 이제 크롬에서 수정된 것으로 보입니다.

자세한 내용은 http://www.quirksmode.org/dom/events/cutcopypaste.html 및 관련 테스트 페이지 http://www.quirksmode.org/dom/events/tests/cutcopypaste.html 도 참조하십시오.

라이브 데모 : http://jsfiddle.net/abdennour/ba54W/

$(document).ready(function() {

    $("#textA").bind({
        copy : function(){
            $('span').text('copy behaviour detected!');
        },
        paste : function(){
            $('span').text('paste behaviour detected!');
        },
        cut : function(){
            $('span').text('cut behaviour detected!');
        }
    });

}); 

jQuery에서 사용자가 상황에 맞는 메뉴, 복사 및 잘라내기를 사용하지 못하도록 하는 간단한 솔루션:

jQuery(document).bind("cut copy contextmenu",function(e){
    e.preventDefault();
});

CSS에서 텍스트 선택을 비활성화하는 것도 도움이 될 것입니다.

.noselect {  
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
     user-select: none;
}

다른 접근 방식(플러그인 필요 없음)을 사용하는 데만 사용할 수 있습니다.ctrlKey전달되는 이벤트 개체의 속성입니다.이벤트가 발생할 때 다음과 같이 눌렀는지를 나타냅니다.

$(document).keypress("c",function(e) {
  if(e.ctrlKey)
    alert("Ctrl+C was pressed!!");
});

jquery(jquery)도 참조하십시오. 키 누름, ctrl+c(또는 그와 같은 콤보).

우클릭, +,C +, X+ 의 경우 V이 코드를 사용하여 동작을 감지하고 방지할 수 있습니다.

$(document).bind('copy', function(e) {
        alert('Copy is not allowed !!!');
        e.preventDefault();
    }); 
    $(document).bind('paste', function() {
        alert('Paste is not allowed !!!');
        e.preventDefault();
    }); 
    $(document).bind('cut', function() {
        alert('Cut  is not allowed !!!');
        e.preventDefault();
    });
    $(document).bind('contextmenu', function(e) {
        alert('Right Click  is not allowed !!!');
        e.preventDefault();
    });

키 누르기 대신 키 다운을 사용합니다.

<input type="text" onkeydown="if(event.ctrlKey && event.keyCode==86){return false;}" name="txt">

간단한 바닐라 자바스크립트 접근법에 관심 있는 사람이 있다면 아래를 참고하세요.

Fiddle 링크: DEMO

      let ctrlActive = false;
      let cActive = false;
      let vActive = false

      document.body.addEventListener('keyup', event => {
        if (event.key == 'Control') ctrlActive = false;
        if (event.code == 'KeyC') cActive = false;
        if (event.code == 'KeyV') vActive = false;
      })

      document.body.addEventListener('keydown', event => {
        if (event.key == 'Control') ctrlActive = true;
        if (ctrlActive == true && event.code == 'KeyC') {

          // this disables the browsers default copy functionality
          event.preventDefault()

          // perform desired action(s) here...
          console.log('The CTRL key and the C key are being pressed simultaneously.')

        }

        if (ctrlActive == true && event.code == 'KeyV') {

          // this disables the browsers default paste functionality
          event.preventDefault()

          // perform desired action(s) here...
          console.log('The CTRL key and the V key are being pressed simultaneously.')

        }

      })

합니다를 하지 않도록 합니다.copy브라우저에서 복사 기능을 브라우저에 유지하려면 다음 내용을 설명해 주십시오를 언급하십시오event.preventDefault()그런 다음 원하는 작업을 실행하는 동시에 사용자가 콘텐츠를 복사할 수 있습니다.

저는 키 누름을 잡아주는 jQuery 플러그인을 썼습니다.OS(폰트 제외) 없이 html 형태로 여러 언어 스크립트 입력이 가능하도록 사용할 수 있습니다.약 300줄의 코드입니다. 한 번 보시겠어요?

• http://miku.github.com/jquery-retype

일반적으로 이러한 변경은 주의해야 합니다.다른 솔루션이 제공되지 않아 고객을 위해 플러그인을 작성했습니다.

element.addEventListener('keydown', function (e) {
    if (e.key == 'c' && e.ctrlKey) {
        e.preventDefault(); // prevent from copying
    }
    if (e.key == 'v' && e.ctrlKey) {
        e.preventDefault(); // prevent from pasting
    }
}

+/CV을(를) 탐지하고 차단할 수 있지만 특정 필드의 값을 변경할 수도 있다는 점을 잊지 마십시오.
가장 좋은 예는 Chrome의 Inspect Element 기능으로 필드의 값 속성을 변경할 수 있습니다.

복사 이벤트 덮어쓰기를 허용하는 후크는 붙여넣기 이벤트와 동일하게 수행하는 데 사용될 수 있습니다.입력 요소를 표시할 수 없습니다. 없음. 또는 가시성: 숨김. 안타깝게도

export const useOverrideCopy = () => {
  const [copyListenerEl, setCopyListenerEl] = React.useState(
    null as HTMLInputElement | null
  )
  const [, setCopyHandler] = React.useState<(e: ClipboardEvent) => void | null>(
    () => () => {}
  )
  // appends a input element to the DOM, that will be focused.
  // when using copy/paste etc, it will target focused elements
  React.useEffect(() => {
    const el = document.createElement("input")  
    // cannot focus a element that is not "visible" aka cannot use display: none or visibility: hidden
    el.style.width = "0"
    el.style.height = "0"
    el.style.opacity = "0"
    el.style.position = "fixed"
    el.style.top = "-20px"
    document.body.appendChild(el)
    setCopyListenerEl(el)
    return () => {
      document.body.removeChild(el)
    }
  }, [])
  // adds a event listener for copying, and removes the old one 
  const overrideCopy = (newOverrideAction: () => any) => {
    setCopyHandler((prevCopyHandler: (e: ClipboardEvent) => void) => {
      const copyHandler = (e: ClipboardEvent) => {
        e.preventDefault()
        newOverrideAction()
      }
      copyListenerEl?.removeEventListener("copy", prevCopyHandler)
      copyListenerEl?.addEventListener("copy", copyHandler)
      copyListenerEl?.focus() // when focused, all copy events will trigger listener above
      return copyHandler
    })
  }
  return { overrideCopy }
}

다음과 같이 사용됩니다.

const customCopyEvent = () => {
    console.log("doing something")
} 
const { overrideCopy } = useOverrideCopy()
overrideCopy(customCopyEvent)

overrideCopy를 호출할 때마다 다시 초점이 맞춰지고 복사 시 사용자 지정 이벤트를 호출합니다.

Jquery를 사용하는 또 다른 간단한 방법:

$(document).keydown( function(e)
{
    if (e.ctrlKey && e.key == 'c')
    {
        console.log('got ctrl c');
    }
    else if (e.ctrlKey && e.key == 'v')
    {
        console.log('got ctrl v');
    }
});

나는 이미 당신의 문제를 가지고 있고 다음 코드로 해결했습니다.숫자만 받아들이는

$('#<%= mobileTextBox.ClientID %>').keydown(function(e) {
            ///// e.which Values
            // 8  : BackSpace , 46 : Delete , 37 : Left , 39 : Rigth , 144: Num Lock 
            if (e.which != 8 && e.which != 46 && e.which != 37 && e.which != 39 && e.which != 144
                && (e.which < 96 || e.which > 105 )) {
                return false;
            }
        });

ID를 탐지할 수 있습니다.e.which == 17

요주의사항

사용하고 있었습니다.e.keyCode잠시동안 +를 누르면 .이 속성이 잘못된 번호인 190을 반환하는 반면 아스키 코드는.46살 입니다!

그래서 당신이 사용해야합니다. e.key.toUpperCase().charCodeAt(0)대신에e.keyCode.

$(document).keydown(function(event) {
  let keyCode = e.key.toUpperCase().charCodeAt(0);
  
  ...
}

이것은 매우 오래된 게시물이지만 모두의 답변은 모두 jQuery를 사용하고 있었고 모든 것이 조작되었습니다.

OP는 사람들이 여러 텍스트 영역에 붙여넣기하는 것을 방지하기를 원했는데, 이것이 더 현대적인 접근 방식입니다.

const targets = document.querySelectorAll( 'textarea' );
for( const target of targets ) target.addEventListener( 'paste', e => e.preventDefault() );

<textarea placeholder="You can't paste in me"></textarea>
<textarea placeholder="You can't paste in me either"></textarea>

키 누르기 이벤트를 듣고 특정 키 코드와 일치하는 경우 기본 이벤트(텍스트 입력)를 중지할 수 있습니다.

그것을 막기 위한 몇 가지 방법이 있습니다.

그러나 사용자는 항상 자바스크립트를 끄거나 페이지의 소스 코드를 볼 수 있습니다.

몇 가지 예(jQuery 필요)

/**
* Stop every keystroke with ctrl key pressed
*/
$(".textbox").keydown(function(){
    if (event.ctrlKey==true) {
        return false;
    }
});

/**
* Clear all data of clipboard on focus
*/
$(".textbox").focus(function(){
    if ( window.clipboardData ) {
        window.clipboardData.setData('text','');
    }
});

/**
* Block the paste event
*/
$(".textbox").bind('paste',function(e){return false;});

편집: Tim Down이 말한 것처럼, 이 기능들은 모두 브라우저 종속 기능입니다.

언급URL : https://stackoverflow.com/questions/2903991/how-to-detect-ctrlv-ctrlc-using-javascript