语言吧技术网欢迎您投稿,程序员的世界我懂你!=====>点此登录投搞
当前位置: 首页 >>JAVASCRIPT >>JS实战技巧 >>HDHCMS获取QQ截图图片并显示JS源码

HDHCMS获取QQ截图图片并显示JS源码

2019/12/2 10:49:00 0人评论 92次 作者:admin

我们在网站发布新闻或其它更新时,很多时候都要用到QQ或其它的一些工具截图,如果需要保存下来再上传就有点麻烦了,为了解决这个问题,HDHCMS运用JS通过监听粘贴功能来获取图片BASE64编码解决当前问题,只需要您与您的后端程序相结合即可完美解决截图直接上传的功能。…

    我们在网站发布新闻或其它更新时,很多时候都要用到QQ或其它的一些工具截图,如果需要保存下来再上传就有点麻烦了,为了解决这个问题,HDHCMS运用JS通过监听粘贴功能来获取图片BASE64编码解决当前问题,只需要您与您的后端程序相结合即可完美解决截图直接上传的功能,源码如下:


<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>HDHCMS获取QQ截图图片并显示JS源码_WWW.HDHCMS.COM</title>

</head>

<script language="javascript">

    document.addEventListener('paste', function (event) {

        var hdhCmsItems = (event.clipboardData && event.clipboardData.items) || [];

        var hdhCmsfile = null;

        if (hdhCmsItems && hdhCmsItems.length) {

            for (var HdhCmsI = 0; HdhCmsI < hdhCmsItems.length; HdhCmsI++) {

                //判断是否为图片文件

                if (hdhCmsItems[HdhCmsI].type.indexOf('image') !== -1) {

                    hdhCmsfile = hdhCmsItems[HdhCmsI].getAsFile();//获取文件

                    var hdhCmsReader = new FileReader();

                    var hdhImgObj = hdhCmsReader.readAsDataURL(hdhCmsfile);

                    hdhCmsReader.onload = function (hdhImgObj) {

                        var hdhCmsBase64 = hdhImgObj.target.result;//获取64位编码

                        document.getElementById("hdhCmsImg").src=hdhCmsBase64;

                    }

                    break;

                }

            }

        }

    });

</script>

<body>

 <img id="hdhCmsImg">

 <BR>进入<a href="http://www.hdhcms.com" target="_blank" title="好得很CMS(HDHCMS)">好得很CMS(HDHCMS)</a>

</body>

</html>  


CopyRight:2007-2018 语言吧 备案ICP:湘ICP备09009000号-15 http://www.yuyanba.com
欢迎【康乃狄克州 】的朋友
内容与素材部分来源于网络,如有侵权请告知删除
分享按钮