网页的文章在电脑上看的时候希望分享到微信怎么操作-草根创业生活网

网页的文章在电脑上看的时候希望分享到微信，需要用户使用手机扫二维码来实现。

这里记录一下实现的方法。

效果：

点击弹出一个窗口，显示二维码

相关代码：

html

<a href="javascript:void(0);" title="分享至微信" onclick="shareToWechat()" class="shareToWechat">
<span class="diggit" style="width:80px;">
<img src="/images/c04.png">
</span>
</a>

qrcode.html页面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>手机扫码分享 - 无知</title>
<script src="/js/jquery-1.8.3.min.js" ></script>
<script src="/js/jquery.qrcode.min.js"></script>
</head>
<body >
    <h3 style="border-bottom: 1px solid #DDDDDD; margin-bottom:15px; padding-bottom: 10px; text-align:center;">用手机扫下面的二维码分享</h3>
    <div id="qrcode" style="margin-bottom:15px;"></div>
    <div style="border-top: 1px solid #DDDDDD;padding-top:11px;">&nbsp;</div>
    <script>
        $.urlParam = function (name) {
            var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
            if (results == null) {
                return null;
            }
            else {
                return results[1] || 0;
            }
        }
    </script>
    <script>         
        $(function () {
            $('#qrcode').qrcode({ width: 200, height: 200, text: decodeURIComponent($.urlParam('url')) });
        });
    </script>
</body>
</html>

依赖：jquery.qrcode.min.js

打开窗口的js代码

function shareToWechat(){
  var url = "/qrcode.html?url=" + encodeURIComponent(window.location);
  var name = "_blank";
  var iWidth = 400;
  var iHeight = 360;
  var iTop = (window.screen.height-30-iHeight)/2;
  var iLeft = (window.screen.width-10-iWidth)/2;
  window.open(url,name,'height='+iHeight+',,innerHeight='+iHeight+',width='+iWidth+',innerWidth='+iWidth+',top='+iTop+',left='+iLeft+',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no');
}

其实 window.location也可以不传递的，qrcode.html页面中可以通过 window.opener.location 来获取。

1、本网站名称：草根创业网
2、本站永久网址：https://www.hzsclcl.com
3、本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长QQ：95114390进行删除处理。
4、本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5、本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
6、本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。

THE END