-

截屏控件示例

示例演示当前窗口截屏以及跨窗口截屏以及截取远程网页,截取远程网页时,当前客户机需要能访问到要截取图像的网址。
截屏图像预览:

示例代码

<div>
	<div class="layui-form">
            <div class="layui-form-item">
            <label class="layui-form-label">网址</label>
            <div class="layui-input-block">
                <input type="text" id="t_curl" placeholder="请输入网址" value="http://www.baidu.com" autocomplete="off" class="layui-input">
            </div>
            </div>
    </div>
	<button class="layui-btn" id="btnCap1">提示切换窗口截屏</button>
	<button class="layui-btn" id="btnCap2">直接截屏</button>
	<button class="layui-btn" id="btnCap3">截取网页</button>
	<blockquote class="layui-elem-quote layui-quote-nm">
        截屏图像预览:
     </blockquote>
     <div class="layui-upload-list layui-border" style="padding:5px 0 5px 0;min-height:200px;" id="capimgList">
     </div>
</div>
<script src="/templates/js/TCTRL.min.js"></script>
<script>
var $=layui.jquery;
TScreenCapture.Register("f8a91e852115e3b11c52bccfd69b44dcf0f5fb05ee59b1a6fc7347e5f6a68f82a0ed583ee9cf37b9b796e60f90e6deac")

TScreenCapture.OnDataIn = function (dat) {
	if(dat.CSTAT>0){
        $("#capimgList").append('<img src="data:image/jpeg;base64,' + dat.CIMG + '" style="height:100px;" /> ')
        //$("#TimgBase64").val(dat.CIMG); //截屏数据 BASE64 String 发送回服务器端解码后得到图片
        //$.post("/demos/TScrnCut/sc2.html", { img: $("#TimgBase64").val(), id: iidx}, function(dat) {
        //    $("#cimg").attr("src","../"+dat.src);
        //}, "json");
	}
}

$("#btnCap1").click(function(){
	TScreenCapture.Capture({
            MODE: 1, //0 直接截屏 1弹出截屏确认窗口,切换到指定窗口截屏 2直接截取电脑屏幕 3截取网页
            CURL: $("#t_curl").val(), //截取网页的url地址
            WMin: false,    //是否最小化当前窗口
            MColor:"#000",  //截屏时半透明罩颜色
            picType:"png"   //返回图像格式
        },function(dat){
                if(dat.STAT==-99 || dat==-99){
                        if(confirm("您还没有安装截屏插件\n\n现在下载安装吗?")){
                           location="/files/TCtrls.exe";
                        }
                }else if(dat.STAT==12){
                        layui.layer.msg(dat.STAT+",注册失败,请联系您的服务商!");
                }	
        });
});
$("#btnCap2").click(function(){
	TScreenCapture.Capture({
            MODE: 0, //0 直接截屏 1弹出截屏确认窗口,切换到指定窗口截屏 2直接截取电脑屏幕 3截取网页
            CURL: $("#t_curl").val(), //截取网页的url地址
            WMin: false,    //是否最小化当前窗口
            MColor:"#000",  //截屏时半透明罩颜色
            picType:"png"   //返回图像格式
        },function(dat){
                if(dat.STAT==-99 || dat==-99){
                        if(confirm("您还没有安装截屏插件\n\n现在下载安装吗?")){
                           location="/files/TCtrls.exe";
                        }
                }else if(dat.STAT==12){
                        layui.layer.msg(dat.STAT+",注册失败,请联系您的服务商!");
                }	
        });
});
$("#btnCap3").click(function(){
	TScreenCapture.Capture({
            MODE: 3, //0 直接截屏 1弹出截屏确认窗口,切换到指定窗口截屏 2直接截取电脑屏幕 3截取网页
            CURL: $("#t_curl").val(), //截取网页的url地址
            WMin: false,    //是否最小化当前窗口
            MColor:"#000",  //截屏时半透明罩颜色
            picType:"png"   //返回图像格式
        },function(dat){
                if(dat.STAT==-99 || dat==-99){
                        if(confirm("您还没有安装截屏插件\n\n现在下载安装吗?")){
                           location="/files/TCtrls.exe";
                        }
                }else if(dat.STAT==12){
                        layui.layer.msg(dat.STAT+",注册失败,请联系您的服务商!");
                }	
        });
});
</script>