zoukankan      html  css  js  c++  java
  • QQ、微信、微博、空间等分享链接接入

    一、HTMl代码
    1、隐藏标签用于获取信息

    <img style="display:none" id="coverImage" src="@item.Art_HeadImg" />
    <input type="hidden" id="description" value="@item.Art_ShortContent">
    <div id="qrcode" style="display:none;"></div>
    

    2、放置分享按钮,图片自行百度吧,就不放了

    <div class="bdsharebuttonbox share">
        <ul>
            <li><img src="~/Content/image/qqShare.png" id="QQSHare" /></li>
            <li><img src="~/Content/image/zoneShare.png" id="ZoneShare" /></li>
            <li><img src="~/Content/image/weiboShare.png" id="WeiboShare" /></li>
            <li><img src="~/Content/image/weiChatShare.png" id="WeiChatShare" /></li>
        </ul>
    </div>
    

    二、JS代码
    1、JS代码

    <script type="text/javascript">
        var qrcode = new QRCode("qrcode", {
            text: location.href,
             200,
            height: 200,
            colorDark: "#000000",
            colorLight: "#ffffff",
            correctLevel: QRCode.CorrectLevel.H
        });
    
    
        //QQ分享
        $("#QQSHare").click(function () {
            var initUrl = "http://connect.qq.com/widget/shareqq/index.html?url=";
            //浏览器网址
            var browser = encodeURIComponent(location.href);
            //console.log(location);
            //文章标题
            var title = $(".r-title").text();
            //分享图片地址
            var coverImage = location.origin + $("#coverImage").attr("src");
            //描述
            var description = $("#description").val();
            initUrl = initUrl + browser + "&sharesource=qzone&title=" + title + "&pics=" + coverImage + "&summary=" + description;// + "&desc=" + description;
            //console.log(coverImage);
            window.open(initUrl);
            //window.open("http://connect.qq.com/widget/shareqq/index.html?url=https://www.dennisdong.top/Article/GetDetail?articleId=30622f5480ad49f78f1556dae8cbc020&sharesource=qzone&title=你的分享标题&pics=你的分享图片地址&summary=你的分享描述&desc=你的分享简述");
        });
    
        //QQ空间分享,本地测试链接为localhost会出现标题和内容undefined
        $("#ZoneShare").click(function () {
            var initUrl = "https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=";
            //浏览器网址
            var browser = encodeURIComponent(location.href);
            //文章标题
            var title = $(".r-title").text();
            //分享图片地址
            var coverImage = location.origin + $("#coverImage").attr("src");
            //描述
            var description = $("#description").val();
            initUrl = initUrl + browser + "&title=" + title + "&pics=" + coverImage + "&summary=" + description;
            //console.log(initUrl);
            window.open(initUrl);
            //https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=http://zixuephp.net/article-309.html?sharesource=qzone&title=一键分享到QQ空间、QQ好友、新浪微博、微信代码&pics=http://zixuephp.net/uploads/image/20170810/1502335815192079.png&summary=通过各自平台的开发接口,进行参数指定,进行一键分享javascript代码功能
        });
    
        //新浪微博
        $("#WeiboShare").click(function () {
            var initUrl = "http://service.weibo.com/share/share.php?url=";
            //浏览器网址
            var browser = encodeURIComponent(location.href);
            //文章标题
            var title = $(".r-title").text();
            //分享图片地址
            var coverImage = location.origin + $("#coverImage").attr("src");
            //描述
            var description = $("#description").val();
            initUrl = initUrl + browser + "&sharesource=weibo&title=" + title + "&pics=" + coverImage + "&appkey=1343713053";
            //console.log(initUrl);
            window.open(initUrl);
            //http://service.weibo.com/share/share.php?url=你的分享网址&sharesource=weibo&title=你的分享标题&pic=你的分享图片&appkey=你的key,需要在新浪微博开放平台中申请
        });
    
        //微信分享
        $("#WeiChatShare").click(function () {
            layer.open({
                type: 1,
                title: false,
                area: ['200px', '200px'],
                shadeClose: true,
                closeBtn: false,
                content: $('#qrcode')
            });
        });
    
    </script>
    

    PS:生成二维码需要引入qrcode.min.js文件

  • 相关阅读:
    去除文件及子文件的隐藏和只读属性
    一个比较全的C++农历算法(转)
    Activity 的窗口去头的方式
    SQL查询显示行号、随机查询、取指定行数据
    C++中map用法详解(转)
    窗口消息大全(转)
    CTreeCtrl的用法汇总(转)
    CTreeView和CTreeCtrl的使用方法(转)
    用CImage加载内存里的Image(转)
    序列化编程,保存和读取配置文件
  • 原文地址:https://www.cnblogs.com/dennisdong/p/14473502.html
Copyright © 2011-2022 走看看