一键分享简单实用应用

闲话少说，基于Bshare控件的分享！

一、引入相应的JavaScript文件包

      <script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#style=-1&uuid=&pophcol=2&lang=zh"></script>

<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC0.js"></script>

二、定义分享图标显示位置，及分享数据

      <div class="bshare-custom" title="分享的标题" url="分享的地址" summary="分享的概要" pic="分享图片的地址" ></div>

 

三、定义分享的具体实现

      var iBShare = {  

   //初始化  

   init: function() {  

       var $shareBox = $(".bshare-custom");  

       //加载分享工具  

       var tools = ''; 

       tools = '<a title="分享到QQ空间" class="bshare-qzone"></a>';  

       tools += '<a title="分享到腾讯微博" class="bshare-qqmb"></a>';  

       tools += '<a title="分享到新浪微博" class="bshare-sinaminiblog"></a>'; 

       tools += '<a title="分享到微信" class="bshare-weixin"></a>';

//        tools += '<a title="分享到人人网" class="bshare-renren"></a>';  

//        tools += '<a title="分享到网易微博" class="bshare-neteasemb"></a>';

//        tools += '<a title="更多平台" class="bshare-more bshare-more-icon more-style-addthis"></a>';  

       $shareBox.append(tools);  

       //绑定分享事件  

       $shareBox.children("a").click(function() {  

           var parents = $(this).parent();  

           bShare.addEntry({  

               title: parents.attr("title"),  

               url: parents.attr("url"),  

               summary: parents.attr("summary"),  

               pic: parents.attr("pic")  

           });  

       });  

   }  

}  

四、调用方法

       iBShare.init();    //初始化 

注意：在实际项目中，数据来自于数据库。也就是说，页面先要显示数据，在初始化调用方法。否则，不能到达预期效果。

 

 

评论

1 楼 滚烫雪糕 2016-03-28  

附：官方网址http://www.bshare.cn/help/installAction
自定义分享平台时，查显示图标。
第一次，不喜勿喷！谢谢