¿Cómo deshabilitar Copiar, Pegar, Cortar y Hacer clic derecho usando jQuery?

Las ctrl+cteclas ctrl+v, ctrl+xy un clic con el botón derecho del mouse se usan para copiar, pegar y cortar cualquier cosa desde cualquier lugar. Se puede deshabilitar para una tarea o página en particular. Veamos cómo deshabilitar cortar, copiar, pegar y hacer clic derecho.

Se puede hacer de dos formas:

Usando un método on()
Usando el método keydown() y mousedown()

Mediante el uso de un método on(): es un método incorporado en jQuery. Con la ayuda de este método, podremos deshabilitar la opción de cortar, copiar, pegar y hacer clic con el botón derecho.

Sintaxis:
```
$(“selector”).on(event, function)
```

Ejemplo:

<!DOCTYPE html>
<html>
  
<head>
    <title>The jQuery Example</title>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
    </script>
    <style>
        #geek {
            padding: 65 px 0;
        }
    </style>
  
    <script>
        $(document).ready(function() {
            
            // Disables ctrl+v, ctrl+x, ctrl+c.
            $('textarea').on("cut", function(e) {
                $("#d2").text('cut. not allowed!');
                e.preventDefault();
            });
            $('textarea').on("copy", function(e) {
                $("#d2").text('copy. not allowed!');
                e.preventDefault();
            });
            $('textarea').on("paste", function(e) {
                $("#d2").text('paste. not allowed!');
                e.preventDefault();
            });
            
            // Above all three can be combined into one, above is 
            // executed separately for understanding purposes.
            /* $('textarea').on("cut copy paste", function(e) {
            $("#d2").text('right-click is disabled!');
            e.preventDefault();
            }); */
            
            // Disables right-click.
            $('textarea').mousedown(function(e) {
                if (e.button == 2) {
                    e.preventDefault();
                    alert('right-click is disabled!');
                }
            });
        });
    </script>
</head>
  
<body>
    <center>
        <div id='geek'>
            <h1 style="color:green">GeeksforGeeks</h1>
            <p id="d1">
                The below textarea won't allow any cut, copy, 
                paste and right-click operations.
            </p>
            <textarea></textarea>
            <p id="d2" style="color:red"></p>
        </div>
    </center>
</body>
  
</html>

Producción:

Al usar el método keydown() y mousedown(): al usar el evento key-down y para deshabilitar el clic derecho, usamos el método mouse-down(). Con la ayuda de estos dos métodos, podremos deshabilitar la opción de cortar, copiar, pegar y hacer clic con el botón derecho.

Sintaxis:

$(“selector”).keydown(function)

$(“selector”).mousedown(function)

Ejemplo:

<!DOCTYPE html>
<html>
  
<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
    </script>
    <style>
        #geek {
            padding: 65px 0;
        }
    </style>
  
    <script>
        $(document).ready(function() {
            $(document).keydown(function(event) {
  
                // 86 is the keycode of v
                if (event.ctrlKey == true && (event.which == '86')) {
                    $("#d2").text('paste. not allowed!');
                    event.preventDefault();
                }
  
                // 88 is the keycode of x
                if (event.ctrlKey == true && (event.which == '88')) {
                    $("#d2").text('cut. not allowed!');
                    event.preventDefault();
                }
  
                // 67 is the keycode of c
                if (event.ctrlKey == true && (event.which == '67')) {
                    $("#d2").text('copy. not allowed!');
                    event.preventDefault();
                }
  
                // Above all three can be combined into one, above is 
                // executed separately for understanding purposes.
                /* if (event.ctrlKey==true && (event.which == '86' 
                || event.which == '67' || event.which == '88')) {
                    alert('cut. copy. paste. not allowed!');
                    event.preventDefault();
                } */
            });
            $('textarea').mousedown(function(e) {
                if (e.button == 2) {
                    alert('right-click is disabled!');
                    e.preventDefault();
                }
            });
        });
    </script>
</head>
  
<body>
    <center>
        <div id='geek'>
            <h1 style="color:green">GeeksforGeeks</h1>
            <p id="d1">
                The below textarea won't allow any cut, copy,
                paste and right-click operations.
            </p>
            <textarea></textarea>
            <p id="d2" style="color:red"></p>
        </div>
    </center>
</body>
  
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por Tejashwi5 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta Cancelar la respuesta