Bagaimana cara mendeteksi Ctrl + V, Ctrl + C menggunakan JavaScript?

Bagaimana cara mendeteksi ctrl+ v, ctrl+ cmenggunakan Javascript?

Saya perlu membatasi menempel di textareas saya, pengguna akhir tidak boleh menyalin dan menempelkan konten, pengguna hanya harus mengetik teks di textarea.

Bagaimana cara mencapai ini?

Saya hanya melakukan ini karena minat. Saya setuju itu bukan hal yang benar untuk dilakukan, tetapi saya pikir itu harus menjadi keputusan op ... Juga kode dapat dengan mudah diperluas untuk menambah fungsionalitas, daripada mengambilnya (seperti clipboard yang lebih maju, atau Ctrl+ smemicu server -selain hemat).

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

Juga hanya untuk memperjelas, skrip ini membutuhkan pustaka jQuery.

Demo codepen

EDIT: menghapus 3 baris berlebihan (melibatkan e.yang) berkat saran Tim Down (lihat komentar)

EDIT: menambahkan dukungan untuk Mac ( cmdbukan kunci ctrl)

Dengan jquery Anda dapat dengan mudah mendeteksi salin, tempel, dll dengan mengikat fungsi:

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

Informasi lebih lanjut di sini: http://www.mkyong.com/jquery/how-to-detect-copy-paste-and-cut-behavior-with-jquery/

Meskipun bisa mengganggu ketika digunakan sebagai langkah anti-pembajakan, saya bisa melihat mungkin ada beberapa contoh di mana itu akan sah, jadi:

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
}

Saya telah menggunakan event.ctrlKeydaripada memeriksa kode kunci seperti pada sebagian besar browser di Mac OS X Ctrl/ Alt"turun" dan "naik" peristiwa tidak pernah dipicu, jadi satu-satunya cara untuk mendeteksi adalah dengan menggunakan event.ctrlKeydalam acara c misalnya setelah Ctrlkuncinya adalah diturunkan. Saya juga mengganti ctrlKeydengan metaKeyuntuk mac.

Keterbatasan metode ini:

• Opera tidak mengizinkan penonaktifan acara klik kanan

• Seret dan lepas di antara jendela browser tidak dapat dicegah sejauh yang saya tahu.

• The edit-> copyitem menu di misalnya Firefox masih dapat memungkinkan copy / paste.

• Juga tidak ada jaminan bahwa untuk orang-orang dengan tata letak keyboard / lokal yang berbeda yang menyalin / menempel / memotong adalah kode kunci yang sama (meskipun tata letak sering hanya mengikuti standar yang sama dengan bahasa Inggris), tetapi selimut "nonaktifkan semua tombol kontrol" berarti memilih semua dll juga akan dinonaktifkan jadi saya pikir itu kompromi yang perlu dibuat.

Ada cara lain untuk melakukan hal ini: onpaste , oncopydanoncut peristiwa dapat terdaftar dan dibatalkan pada IE, Firefox, Chrome, Safari (dengan beberapa masalah kecil), browser hanya utama yang tidak memungkinkan membatalkan peristiwa ini adalah Opera.

Seperti yang Anda lihat di jawaban saya yang lain, menyadap Ctrl+ vdan Ctrl+ cmemiliki banyak efek samping, dan itu masih tidak mencegah pengguna menyisipkan menggunakan Editmenu Firefox dll.

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 masih memiliki beberapa masalah kecil dengan metode ini (ini menghapus clipboard menggantikan cut / copy ketika mencegah default) tetapi bug itu tampaknya telah diperbaiki di Chrome sekarang.

Lihat juga: http://www.quirksmode.org/dom/events/cutcopypaste.html dan halaman pengujian terkait http://www.quirksmode.org/dom/events/tests/cutcopypaste.html untuk informasi lebih lanjut.

Demo Langsung: 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!');
        }
    });

}); 

Solusi singkat untuk mencegah pengguna menggunakan menu konteks, menyalin dan memotong jQuery:

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

Juga menonaktifkan pemilihan teks di CSS mungkin berguna:

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

Jika Anda menggunakan ctrlKeyproperti, Anda tidak perlu mempertahankan status.

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

Saya menulis plugin jQuery, yang menangkap penekanan tombol. Ini dapat digunakan untuk mengaktifkan input skrip berbagai bahasa dalam bentuk html tanpa OS (kecuali font). Sekitar 300 baris kode, mungkin Anda ingin melihatnya:

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

Secara umum, berhati-hatilah dengan perubahan seperti itu. Saya menulis plugin untuk klien karena solusi lain tidak tersedia.

Anda dapat menggunakan kode ini untuk klik kanan, CTRL+ C, CTRL+ V, CTRL+ Xmendeteksi dan mencegah tindakan mereka

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

alih-alih menekan tombol, gunakan onkeydown.

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

Pendekatan lain (tidak memerlukan plugin) hanya untuk menggunakan ctrlKeyproperti dari objek acara yang akan diteruskan. Ini menunjukkan jika Ctrlditekan pada saat acara, seperti ini:

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

Lihat juga jquery: penekanan tombol, ctrl + c (atau kombo seperti itu) .

Jangan lupa bahwa, meskipun Anda mungkin dapat mendeteksi dan memblokir Ctrl+ C/ V, Anda masih dapat mengubah nilai bidang tertentu.
Contoh terbaik untuk ini adalah fungsi Elemen Inspeksi Chrome, ini memungkinkan Anda untuk mengubah properti nilai suatu bidang.

saya sudah memiliki masalah Anda dan saya menyelesaikannya dengan kode berikut .. yang hanya menerima angka

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

Anda dapat mendeteksi Ctrlide.which == 17

Anda dapat mendengarkan acara penekanan tombol, dan menghentikan acara default (memasukkan teks) jika cocok dengan kode kunci tertentu.

Catatan penting

Saya menggunakan e.keyCodeuntuk sementara waktu dan saya mendeteksi bahwa ketika saya menekan ctrl+ ., atribut ini mengembalikan nomor yang salah, 190, sedangkan kode ascii .adalah 46!

Jadi sebaiknya Anda gunakan e.key.toUpperCase().charCodeAt(0)saja e.keyCode.

Ada beberapa cara untuk mencegahnya.

Namun, pengguna akan selalu dapat mematikan javascript atau hanya melihat pada kode sumber halaman.

Beberapa contoh (memerlukan 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;});

Sunting: Bagaimana Tim Down berkata, semua fungsi ini adalah tanggungan browser.