html实现以一个简单的分享功能介绍

超级简单的分享。

包括：QQ、QQ空间、新浪微博、腾讯微博，微信（只是一个二维码）；

1、首先是html代码：

（前端我并不太会，一直用的都是bootstrap）

 1  
 
 2                          
 3                             @@##@@ 
 4                             QQ好友 
 5                          
 6                     
 
 7  
 8                     
 
 9                         
 10                             @@##@@
 11                             微信
 12                         
 13                     
 14                     

 15                         
 16                             @@##@@
 17                             QQ空间
 18                         
 19                     
 20                     

 21                         
 22                             @@##@@
 23                             新浪微博
 24                         
 25                     

1、然后js代码：

立即学习“前端免费学习笔记（深入）”；

（这里不包括微信的，）

睿拓智能网站系统-网上商城

睿拓智能网站系统-网上商城1.0免费版软件大小:5M运行环境：asp+access本版本是永州睿拓信息专为电子商务入门级用户开发的网上电子商城系统，拥有产品发布，新闻发布，在线下单等全部功能，并且正式商用用户可在线提供多个模板更换，可实现一般网店交易所有功能，是中小企业和个人开展个人独立电子商务商城最佳的选择，以下为详细功能介绍：1.最新产品-提供最新产品发布管理修改，和最新产品订单查看2.推荐产

下载

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=' + shareImg
12                 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 = ' 
=' + shareUrl + '&title=' +  shareTitle + '&&source=' + shareUrl + '
&sourceUrl=' + shareUrl + '&content=' + shareDesc + '&pic=' + shareImg;
33                 break;
34         }
35         window.open(openUrl);   
}

3、然后微信的是弹出二维码：

（用的还是bootstrap模态框）

1   
2             
 
4                 
 
5                     
 
6                         
 
7                              
9                                 ×
10                             
11                             

12                                 用微信扫描二维码分享到朋友圈
13                             
14                         
15                         

16                             @@##@@
19                         
20                         

21                             
23                                 关闭
24                             
25                         
26                     

27                 

28             

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    
}