点击按钮弹出生成的二维码一种方式

需要引入的js

<script type="text/javascript" src="/${res}/js/jquery/jquery.min.js">script>
<script type="text/javascript" src="/${res}/js/layer/layer.js">script>

在html或者jsp页面上添加按钮以及放置二维码的容器

 <div style="color: #fff;font-size: 0.2rem;text-align: center;" onclick="share()">
                        分享
                    div>
                    <div class="social-share1" style="text-align:center; display:none;" id="shareDiv">
                    id="testimg" style="float:right;cursor:pointer" alt="" width="300" height="300"/>  
                    div> 

js中的方法

 function share(){  
                $("#testimg").attr("src","http://qr.liantu.com/api.php?text="+要分享的地址);
                layer.open({
                      type: 1,
                      skin: '', //样式类名
                      title:false,
                      offset: 'auto',
                      area: ['300px', '300px'], //宽高
                      closeBtn: 0, //不显示关闭按钮
                      shade: 0,
                      anim: 2,
                      shadeClose: true, //开启遮罩关闭
                      content: $("#shareDiv")
                    });

            }

如果是要分享当前页面,可以在地址那写window.location.href

可以在线生成二维码的方式很多,以下是几个链接

1.http://pan.baidu.com/share/qrcode?w=150&h=150&url=http://www.54admin.net
2.http://b.bshare.cn/barCode?site=weixin&url=http://www.54admin.net
3.http://s.jiathis.com/qrcode.php?url=http://www.54admin.net
5.http://api.k780.com:88/?app=qr.get&data=http://www.54admin.net&level=L&size=6
6.https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=http://www.54admin.net

你可能感兴趣的:(点击按钮弹出生成的二维码一种方式)