我爱模板网 > 建站教程 > JS、jQ、TS >  PC端分享到微信、qq空间、微博正文

PC端分享到微信、qq空间、微博

一个简单的PC端分享到微信、QQ控件、微博的代码,分享到微信采用的是qrcode.js生成二维码,可以用微信扫一扫,效果如下:



1、html代码
<div class="share-div">
    <span>分享</span>
    <a class="a1">
        <img src="images/shejiao_02.png">
        <!--这个容器用来生成qrcode-->
        <div class="wxpop" id="qrcode"></div>
    </a>
    <!--分享到QQ空间-->
    <a href="http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?summary=文章标题&desc=文章描述&pics=图片地址&url=文章地址"><img src="images/shejiao_03.png"></a>
    <!--分享到新浪微博-->
    <a href="http://v.t.sina.com.cn/share/share.php?title=文章标题&url=文章地址&pic=图片地址"><img src="images/shejiao_01.png"></a>
</div>
如上代码,分享到QQ空间和分享到新浪微博,就是跳转到对应的分享页面,同时把当前页面的一些参数带过去。

2、引入qrcode.js
<script type="text/javascript" src="./js/qrcode.js"></script>
3、js代码:
//分享到微信的二维码
var path = window.location.href;
var qrcodeBox = document.getElementById("qrcode");
qrcodeBox.innerHTML = '';
var qrcode = new QRCode(qrcodeBox, {
    text: path,
    width: 100,
    height: 100,
    colorDark: "#000000",
    colorLight: "#ffffff",
    correctLevel: QRCode.CorrectLevel.L
});



部分素材资源来源网站,本站提供免费下载,如有侵权请联系站长马上删除!
上一篇:layer配合video.js播放视频并实现自适应 下一篇:axios POST提交数据的三种类型
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
选择头像:
最新评论

猜你喜欢