產(chǎn)品在原有的頁面上增加了一個二維碼分享功能滤淳，調(diào)試階段加上之后也沒啥事蘸泻，后來多加了些參數(shù)琉苇，結(jié)果微信掃不出來了。沒辦法把二維碼的大小設(shè)置大了些之后悦施，便可以掃了，但頁面布局就完蛋了去团，最后只好使用popover來實現(xiàn)了抡诞。
- 增加分享超鏈接
<a class="btn btn-link active">分享</a>
- 在超鏈標(biāo)簽上實現(xiàn)popover
$('#shareLink').popover({
trigger: 'manual',
html: 'true',
// 本來這里是打算用funciton提供已生成二維碼的DIV，結(jié)果獲取不到生成的二維碼
content: '<div id="qrcode" style="width: 160px; height: 160px;"></div>',
animation: false,
placement: 'left'
}).on("mouseenter", function () {
var self = this;
$(this).popover("show");
// 只有show之后土陪，popover的content才出現(xiàn)在dom中昼汗，此時才能生成二維碼
$(".popover #qrcode").qrcode({
width: 160,
height: 160,
render: 'canvas',
// 這里實際是個動態(tài)url，把代碼簡化了
text: 'http://www.baidu.com
});
$(this).siblings(".popover").on("mouseleave", function () {
$(self).popover('hide');
});
}).on("mouseleave", function () {
var self = this;
setTimeout(function () {
if (!$(".popover:hover").length) {
$(self).popover("hide")
}
}, 100);
})
