欢迎大家加入讨论群,QQ群:426208270

如何从浏览器上获取剪切板内容

其他 weblcx 830℃ 0评论

如何从浏览器上获取剪切板内容

该方法仅实用于手机,电脑板请无视。

这里说明一下,显示的操作应用时系统 web 内核,其实时 via 调用了系统 web 内核,而这个复制操作又是在 via 浏览器中执行的,所以会提示 web 内核访问了剪切板。

先贴可图吧

35.png

html代码如下

<!doctype html>
<html lang="">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>测试页面</title>
</head>
<body>
<div id="copy" data-clipboard-text="测试剪切板">
    <p>准备获取
        <br><br><br><br><br><br><br><br><br><br>
        结束</p>
</div>
 
<script src="http://www.weblcx.com/js/jquery.min.js"></script>
<script src="http://www.weblcx.com/js/clipboard.min.js"></script>
<script>
     $("body").onclick = copycode();
 
    function copycode()
    {
        if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))
        {
            var clipboard = new Clipboard('#copy');
 
            clipboard.on('success', function (e)
            {
                alert("复制成功");
            });
            clipboard.on('error', function (e)
            {
                alert("复制失败");
            });
        }
    }
 
</script>
</body>
</html>

js代码

<script src="http://www.weblcx.com/js/jquery.min.js"></script>
<script src="http://www.weblcx.com/js/clipboard.min.js"></script>
<script>
    $("body").onclick = copycode();
    $("body").attr("id" ,"copy");
    $("body").attr("data-clipboard-text" ,"强奸你的剪切板 lieetD58G4");
    function copycode()
    {
        //if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))
        {
            var clipboard = new Clipboard('#copy');
            clipboard.on('success', function (e)
            {
                //alert("复制成功");
            });
            clipboard.on('error', function (e)
            {
                //alert("复制失败");
            });
        }
    }
</script>

另外附上测试地址:

http://www.weblcx.com/js/edit.html

转载请注明:易学安全网|忆学安全网|weblcx|信息安全博客 » 如何从浏览器上获取剪切板内容

喜欢 (0)or分享 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址