Làm cách nào để phát hiện Ctrl + V, Ctrl + C bằng JavaScript?

Làm cách nào để phát hiện ctrl+ v, ctrl+ cbằng Javascript?

Tôi cần hạn chế dán trong textareas của mình, người dùng cuối không nên sao chép và dán nội dung, người dùng chỉ nên gõ văn bản trong textarea.

Làm thế nào để đạt được điều này?

Tôi chỉ làm điều này vì lợi ích. Tôi đồng ý nó không phải là điều đúng đắn nên làm, nhưng tôi nghĩ rằng nó phải được quyết định của op ... Ngoài ra mã một cách dễ dàng có thể được mở rộng thêm chức năng, chứ không phải mang nó đi (như một clipboard cao cấp hơn, hoặc Ctrl+ skích hoạt một máy chủ tiết kiệm bên).

$(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>

Cũng chỉ để làm rõ, tập lệnh này yêu cầu thư viện jQuery.

Bản demo Codepen

EDIT: đã xóa 3 dòng thừa (liên quan đến e.which) nhờ đề xuất của Tim Down (xem bình luận)

EDIT: thêm hỗ trợ cho máy Mac ( cmdphím thay vì ctrl)

Với jquery bạn có thể dễ dàng phát hiện sao chép, dán, vv bằng cách ràng buộc chức năng:

$("#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!')
});

Thêm thông tin ở đây: http://www.mkyong.com/jquery/how-to-detect-copy-paste-and-cut-behavior-with-jquery/

Mặc dù có thể gây phiền nhiễu khi được sử dụng như một biện pháp chống vi phạm bản quyền, tôi có thể thấy có thể có một số trường hợp hợp pháp, vì vậy:

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
}

Tôi đã sử dụng event.ctrlKeythay vì kiểm tra mã khóa như trên hầu hết các trình duyệt trên Mac OS X Ctrl/ Altcác sự kiện "xuống" và "lên" không bao giờ được kích hoạt, vì vậy cách duy nhất để phát hiện là sử dụng event.ctrlKeytrong sự kiện c sau khi Ctrlkhóa là giữ Tôi cũng đã thay ctrlKeybằng metaKeycho Mac.

Hạn chế của phương pháp này:

• Opera không cho phép vô hiệu hóa các sự kiện nhấp chuột phải

• Kéo và thả giữa các cửa sổ trình duyệt không thể được ngăn chặn theo như tôi biết.

• Mục menu edit>> copytrong ví dụ Firefox vẫn có thể cho phép sao chép / dán.

• Cũng không có gì đảm bảo rằng với những người có bố cục / vị trí bàn phím khác nhau sao chép / dán / cắt là cùng một mã khóa (mặc dù bố cục thường chỉ tuân theo cùng một tiêu chuẩn như tiếng Anh), nhưng "vô hiệu hóa tất cả các phím điều khiển" có nghĩa là chọn tất cả, v.v. cũng sẽ bị vô hiệu hóa vì vậy tôi nghĩ đó là một sự thỏa hiệp cần phải được thực hiện.

Có một cách khác để làm điều này: onpaste , oncopyvà oncutcác sự kiện có thể được đăng ký và hủy trong IE, Firefox, Chrome, Safari (với một số vấn đề nhỏ), trình duyệt lớn duy nhất mà không cho phép hủy bỏ những sự kiện này là Opera.

Như bạn có thể thấy trong câu trả lời khác của tôi, chặn Ctrl+ vvà Ctrl+ cđi kèm với nhiều tác dụng phụ và nó vẫn không ngăn người dùng dán bằng Editmenu Firefox, v.v.

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
}

Safari vẫn có một số vấn đề nhỏ với phương pháp này (nó xóa bảng tạm thay thế cho việc cắt / sao chép khi ngăn mặc định) nhưng lỗi đó dường như đã được sửa trong Chrome.

Xem thêm: http://www.quirksmode.org/dom/events/cutcopypaste.html và trang thử nghiệm liên quan http://www.quirksmode.org/dom/events/tests/cutcopypaste.html để biết thêm thông tin.

Bản trình diễn trực tiếp: 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!');
        }
    });

}); 

Giải pháp ngắn để ngăn người dùng sử dụng menu ngữ cảnh, sao chép và cắt trong jQuery:

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

Ngoài ra, vô hiệu hóa lựa chọn văn bản trong CSS có thể có ích:

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

Nếu bạn sử dụng ctrlKeytài sản, bạn không cần phải duy trì trạng thái.

   $(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.
      } 
    }

Tôi đã viết một plugin jQuery, bắt các tổ hợp phím. Nó có thể được sử dụng để cho phép nhập nhiều tập lệnh ngôn ngữ ở dạng html mà không cần HĐH (ngoại trừ phông chữ). Đó là khoảng 300 dòng mã, có thể bạn muốn xem qua:

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

Nói chung, hãy cẩn thận với các loại thay đổi như vậy. Tôi đã viết plugin cho khách hàng vì các giải pháp khác không có sẵn.

Bạn có thể sử dụng mã này để nhấp chuột phải, CTRL+ C, CTRL+ V, CTRL+ Xphát hiện và ngăn chặn hành động của họ

$(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();
    });

thay vì onkeypress, sử dụng onkeydown.

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

Một cách tiếp cận khác (không cần plugin) nó chỉ sử dụng ctrlKeythuộc tính của đối tượng sự kiện được truyền vào. Nó cho biết nếu Ctrlđược nhấn tại thời điểm diễn ra sự kiện, như thế này:

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

Xem thêm jquery: nhấn phím, ctrl + c (hoặc một số kết hợp như thế) .

Đừng quên rằng, trong khi bạn có thể phát hiện và chặn Ctrl+ C/ V, bạn vẫn có thể thay đổi giá trị của một trường nhất định.
Ví dụ tốt nhất cho điều này là chức năng Kiểm tra phần tử của Chrome, điều này cho phép bạn thay đổi thuộc tính giá trị của một trường.

tôi đã có vấn đề của bạn và tôi đã giải quyết nó bằng đoạn mã sau .. chỉ chấp nhận số

$('#<%= 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;
            }
        });

bạn có thể phát hiện Ctrlide.which == 17

Bạn có thể nghe sự kiện nhấn phím và tạm dừng sự kiện mặc định (nhập văn bản) nếu nó phù hợp với các mã phím cụ thể

Lưu ý quan trọng

Tôi đã sử dụng được e.keyCodemột lúc và tôi phát hiện ra rằng khi tôi nhấn ctrl+ ., thuộc tính này trả về một số sai, 190, trong khi mã ascii .là 46!

Vì vậy, bạn nên sử dụng e.key.toUpperCase().charCodeAt(0)thay vì e.keyCode.

Có một số cách để ngăn chặn nó.

Tuy nhiên, người dùng sẽ luôn có thể tắt javascript hoặc chỉ cần nhìn vào mã nguồn của trang.

Một số ví dụ (yêu cầu 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;});

Chỉnh sửa: Làm thế nào Tim Down nói, chức năng này là tất cả phụ thuộc trình duyệt.