时间戳

首页 > 解决方案 > JS - 有没有办法显示剪贴板文本？

javascript - JS - 有没有办法显示剪贴板文本？

问题描述

我正在做一个学校作业，我试图提高 和 的Ctrl + c知名度Ctrl + p。我现在的目标是在一秒钟内显示复制了哪些文本textarea。我的代码“有效”，但并不理想。

这是我的代码（我从这里和这里得到的）：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h3>Ctrl+c Ctrl+v allowed</h3>
<textarea></textarea>
<br>
<br>
<h3>Clipboard</h3>
<textarea id="clipBoard"></textarea>

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

        // Document Ctrl + C/V 
        $(document).keydown(function(e) {

            var clip = document.getElementById("clipBoard");
            if (ctrlDown && (e.keyCode == cKey))
            {
                navigator.clipboard.readText()
                .then(text => {
                    clip.value = text;
                })
                .catch(err => {

                });
                console.log("Document catch Ctrl+C");

            }
            if (ctrlDown && (e.keyCode == vKey)) 
            {
                console.log("Document catch Ctrl+V");
            }
        });
    });
</script>

这个解决方案有两个问题。

首先，网页请求复制许可。我理解这样做的必要性，但是有没有办法解决这个问题？

其次，如果用户说不，那么当剪贴板中有某些内容会破坏分配时，我将无法显示剪贴板文本。

有没有办法解决这些问题？

谢谢！

标签： javascripthtmlclipboard

解决方案

不可以。您可以使用较旧的技术，例如execCommand将剪贴板内容粘贴到焦点文本框中，但这需要实际粘贴它并且已经过时。现代剪贴板 API 需要用户许可是有充分理由的（想象一下，如果您复制了色情 URL 或银行帐号，并且网站可以在没有人知道的情况下获取该信息）——试图绕过 API 的许可要求要求不好。如果这是为了学校作业，我认为您的老师或任何给您评分的人在他们要求您获取剪贴板内容时不会授予浏览器使用剪贴板 API 的权限。

推荐阅读