web截屏功能的实现

最新推荐文章于 2024-05-19 09:45:52 发布

vcxiaohan2

最新推荐文章于 2024-05-19 09:45:52 发布

阅读量1w

点赞数 4

分类专栏： jQuery

本文链接：https://blog.csdn.net/u011500781/article/details/51303684

版权

jQuery 专栏收录该内容

26 篇文章 0 订阅

订阅专栏

请在这里查看示例 ☞ capture示例

1.提示用户安装activex控件(推荐一款比较好的控件：乖乖牛，主页地址：http://www.ggniu.cn/，具体使用方法可加他们群下载使用文档)

2.如果使用chrome浏览器，那么jquery.json-2.3.min.js是必须引用的

以下是我自己写的示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>capture</title>

    <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="js/niuniucapture.js"></script>
    <script type="text/javascript" src="js/jquery.json-2.3.min.js"></script>

    <style>
        * {margin: 0; padding: 0;}
    </style>
</head>
<body>
    <button class="capture1">屏幕截图</button>
    <script>
        ;$(function() {
            var captureObj = new NiuniuCaptureObject();//生成实例
            captureObj.InitNiuniuCapture();//初始化控件

            captureObj.PluginLoadedCallback = function(success) {//初始化完毕
            }
            captureObj.FinishedCallback = function(type, x, y, width, height, info, content, localpath) {//截屏完毕
                console.log('type----'+ type);//type<0 需要重新安装控件;type=1 截图完成;type=2 取消截图;type=3 保存截图到本地;type=4 剪贴板获取截图
                console.log('x----'+ x);
                console.log('y----'+ y);
                console.log('width----'+ width);
                console.log('height----'+ height);
                console.log('info----'+ info);
                console.log('content----'+ content);
                console.log('localpath----'+ localpath);
            }

            $('.capture1').on('click', function() {
                var captureRet = captureObj.DoCapture("pic.jpg"/*后缀名*/, 0/*是否隐藏当前窗口*/, 3/*截屏方式：0：表示普通截图；1：表示截取指定区域，区域由x、y、width、height参数指定；2：表示截取当前桌面；3: 表示截图时先弹出一个提示窗口；4: 从剪贴板中获取图片*/, 0, 0, 0, 0);

                if(!captureRet) {//没有安装控件
                    ShowDownLoad();
                }
            });

            //根据是否是Chrome新版本来控制下载不同的控件安装包
            function ShowDownLoad() {
                if(captureObj.IsNeedCrx()) {
                    ShowChromeInstallDownload(); 
                }else {
                    ShowIntallDownload();
                }
            }

            function ShowChromeInstallDownload() {
                var ret = confirm("您需要先下载Chrome扩展安装包进行安装，点击确定继续!");

                if(ret) {
                    window.location.href="http://www.ggniu.cn/download/CaptureInstallChrome.exe";  
                }

            }

            function ShowIntallDownload() {
                var ret = confirm("您需要先下载控件进行安装，点击确定继续!");

                if(ret) {
                    window.location.href="http://www.ggniu.cn/download/CaptureInstall.exe";  
                }
            }

        });
        
    </script>
</body>
</html>

vcxiaohan2

关注

4
点赞
踩
6

收藏

觉得还不错? 一键收藏
2
评论
web截屏功能的实现

1.提示用户安装activex控件(推荐一款比较好的控件：乖乖牛，主页地址：http://www.ggniu.cn/，具体使用方法可加他们群下载使用文档)2.如果使用chrome浏览器，那么jquery.json-2.3.min.js是必须引用的以下是我自己写的示例： capture * {margin:
复制链接

扫一扫

专栏目录