簡體   English   中英

無法使用 JavaScript 禁用打印屏幕、復制/粘貼和右鍵單擊功能

[英]Trouble disabling the Print Screen, Copy/Paste and right-click functionalities using JavaScript

我在實現 JavaScript 代碼以使用 JavaScript 和 jQuery 禁用復制/粘貼、打印屏幕和右鍵單擊(上下文菜單)時遇到困難。

問題是,如果我注釋掉涉及禁用復制粘貼和右鍵單擊功能的 jQuery 代碼塊,則不會禁用打印屏幕功能(我已經通過在 MS Paint 中粘貼進行了測試)。

這是我的代碼:

<!DOCTYPE html>

<head>
<title>Disable Print Screen Demo</title>
<style>
    .container {
        background-color: lightblue;
        width: 400px;
        height: 200px;
        margin: 0px 0px 0px 390px;
        padding: 50px;
        border: 2px solid blue;
    }
</style>

<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
</head>

<body>
<div class="container">
    <h1>Disable Print Screen Demo</h1>
    <hr />
    <p>
        Try to press the <b>"PrintScreen/SysRq"</b> key on your keyboard. 
    The user will get an alert that PrintScreen is Disabled and the content 
    will not be copied to the clipboard. 
    </p>
    </div>

<script>

// Disable Mouse Right Click
$(document).ready(function() {
    $("body").on("contextmenu", function(e){
        return false;
    });
});

// Disable PrintScreen (Screenshot)
document.addEventListener("keyup", function (e) {
    var keyCode = e.keyCode ? e.keyCode : e.which;
    if (keyCode == 44) {
        stopPrntScr();
        alert("Print Screen is Disabled!");
    }
});

function stopPrntScr() {
    var inpFld = document.createElement("input");
    inpFld.setAttribute("value", ".");
    inpFld.setAttribute("width", "0");
    inpFld.style.height = "0px";
    inpFld.style.width = "0px";
    inpFld.style.border = "0px";
    document.body.appendChild(inpFld);
    inpFld.select();
    document.execCommand("copy");
    inpFld.remove(inpFld);


    // Disable Cut Copy Paste
    $(document).ready(function(){
    $('body').bind('cut copy paste', function(e){
        e.preventDefault();
    });
});
}
</script>

</body>

</html>

使用此 CSS 而不是 javascript,這將阻止在瀏覽器中選擇文本。

<body class="noselect">
      your content goes here...
</body>

    <style>
        .noselect {
            -webkit-touch-callout: none; /* iOS Safari */
            -webkit-user-select: none; /* Safari */
            -moz-user-select: none; /* Old versions of Firefox */
            -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                      supported by Chrome, Edge, Opera and Firefox */
        }
    </style>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM