Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Mengesan dan Menghalang Gabungan Kunci Ctrl V dan Ctrl C dalam JavaScript?

Bagaimana untuk Mengesan dan Menghalang Gabungan Kunci Ctrl V dan Ctrl C dalam JavaScript?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-10-27 11:49:02941semak imbas

How to Detect and Block Ctrl V and Ctrl C Key Combinations in JavaScript?

Mengesan Ctrl V dan Ctrl C dalam JavaScript

Untuk menghalang pengguna daripada menampal kandungan ke dalam kawasan teks, JavaScript boleh digunakan untuk mengesan dan menyekat kombinasi papan kekunci tertentu.

Pendekatan biasa melibatkan penggunaan acara keydown dan keyup untuk memantau penekanan dan pelepasan kekunci Ctrl (ctrlKey atau cmdKey untuk Mac). Apabila Ctrl dikesan, tekanan seterusnya kekunci V (tampal) atau C (salin) dipintas.

Berikut ialah contoh coretan kod:

<code class="javascript">$(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 &amp;&amp; (e.keyCode == vKey || e.keyCode == cKey)) return false;
    });
    
    // Document Ctrl + C/V 
    $(document).keydown(function(e) {
        if (ctrlDown &amp;&amp; (e.keyCode == cKey)) console.log("Document catch Ctrl+C");
        if (ctrlDown &amp;&amp; (e.keyCode == vKey)) console.log("Document catch Ctrl+V");
    });
});</code>

Dalam kod ini, elemen dengan Kelas "no-copy-paste" mempunyai Ctrl V dan Ctrl C dilumpuhkan. Kod ini juga merekodkan gabungan kekunci ini apabila ditekan di mana-mana dalam dokumen.

Pelaksanaan

Untuk melaksanakan ini dalam kawasan teks, HTML dan CSS boleh digunakan:

<code class="html"><h3>Ctrl+c Ctrl+v disabled</h3>
<textarea class="no-copy-paste"></textarea>
<br><br>
<h3>Ctrl+c Ctrl+v allowed</h3>
<textarea></textarea></code>
<code class="css">.no-copy-paste {
    -webkit-user-select: none;  /* Chrome/Safari */
    -moz-user-select: none;     /* Firefox */
    -ms-user-select: none;      /* IE/Edge */
    user-select: none;          /* Standard syntax */
}</code>

Pendekatan ini berkesan menghalang teks daripada disalin dan ditampal ke dalam kawasan teks yang dilindungi.

Atas ialah kandungan terperinci Bagaimana untuk Mengesan dan Menghalang Gabungan Kunci Ctrl V dan Ctrl C dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn