html简单的分享功能-创新互联
超级简单的分享。
成都网站建设、网站设计,成都做网站公司-创新互联建站已向超过千家企业提供了,网站设计,网站制作,网络营销等服务!设计与技术结合,多年网站推广经验,合理的价格为您打造企业品质网站。包括:QQ、QQ空间、新浪微博、腾讯微博,微信(只是一个二维码);
1、首先是html代码:
(前端我并不太会,一直用的都是bootstrap)
12 3 4 QQ好友 5 67 89 10 11 微信12 131415 16 17 QQ空间18 192021 22 23 新浪微博24 25
1、然后js代码:
(这里不包括微信的,)
1 function open_share(type) { 2 var shareUrl = ‘http://www.baidu.com’; 3 var shareTitle = '自定义标题'; 4 var shareImg = 'http://s.jiathis.com/qrcode.php?url=' + shareUrl; 5 var shareDesc = '自定义内容'; 6 var openUrl = ''; 7 switch (type) { 8 case 'qzone': 9 openUrl = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=' + shareUrl + '&title=' + shareTitle + '&pics=' + shareImg12 break;13 case 'weixin':14 t_delay('请在微信客户端使用');15 return false;16 break;17 case 'qq':18 openUrl = 'http://connect.qq.com/widget/shareqq/index.html?url=' + shareUrl + '&desc=' + shareDesc + '&summary=' + shareDesc + '&site=' + shareUrl + '&pics=' + shareImg;21 break;22 case 'tqq':23 openUrl = 'http://v.t.qq.com/share/share.php?title=' + shareTitle + '&url=' + shareUrl + '&site=' + shareUrl + '&pic=' + shareImg;26 break;27 case 'weibo':28 openUrl = 'http://v.t.sina.com.cn/share/share.php?url=' + shareUrl + '&title=' + shareTitle + '&&source=' + shareUrl + '&sourceUrl=' + shareUrl + '&content=' + shareDesc + '&pic=' + shareImg;33 break;34 }35 window.open(openUrl); }
3、然后微信的是弹出二维码:
(用的还是bootstrap模态框)
1 245286277 111512 用微信扫描二维码分享到朋友圈13
1416 192021 2526
4、最后是判断是否在微信中打开:
(从别处扒来的,我这里做的是如果是微信中打开,就把原先弹出的二维码和模态框给移除,放上一张带箭头的提示图片,让用户用微信自带的分享。)
1 //判断微信 2 function is_weixn(){ 3 var ua = navigator.userAgent.toLowerCase(); 4 if(ua.match(/MicroMessenger/i)=="micromessenger") { 5 $("div").remove("div[class=modal-content]"); 6 var $htmlLi = $(''); 7 8 //创建DOM对象 9 var $ul = $("#xian"); //获取UL对象10 $ul.append($htmlLi); //将$htmlLi追加到$ul元素的li列表11 12 } else {13 //不是微信14 }15 }
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
文章题目:html简单的分享功能-创新互联
转载源于:http://ybzwz.com/article/iseoh.html