百度分享组件分享事件捕捉

百度分享组件是一款非常方便的网页分享工具,只是,如果要在使用分享功能的同时,记录分享的信息,那么就需要捕捉点击分享链接时执行分享的事件。

在网络上面搜索了一下,发现没有这方面的资料,就自己努力实现了一下。目前已经可以完美实现。不说了,看下面代码:

<!-- Baidu Button BEGIN -->

                                <div id="bdshare" class="bdshare_t bds_tools get-codes-bdshare bdsharebuttonbox" >

                                     <a href="#" class="bds_more" data-cmd="more"></a>

                                     <a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>

                                     <a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a>

                                     <a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>

                                     <a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>

                                     <a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a>

                                 </div>

                                  <script type="text/javascript">

                                      window._bd_share_config = {

                                          "common": {

                                              "bdSnsKey": {}, "bdText": '', "bdPic": "", "bdMini": "2", "bdMiniList": false, "bdStyle": "0", "bdSize": "16"

                                          },

                                          "share": {}

                                      };

                                      with (document) 0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = 'http://bdimg.share.baidu.com/static/api/js/share.js?v=86835285.js?cdnversion=' + ~(-new Date() / 36e5)];

                                      /*页面直接展示的按钮点击事件*/

                                      $("#bdshare a[href='#']").click(function () {

                                          var cname = $(this).attr("class");

                                          if (cname == "bds_more") {/*点击更多时为弹出框绑定事件*/

                                              setTimeout(bindbdshare_dialog, 600);

                                          }

                                          else {

                                              shareRecord(cname, document.location.href);

                                          }

                                      });

                                      /*更多按钮浮动框事件绑定*/

                                      $(".bds_more").hover(function () {

                                          $(".bdshare_popup_list a[href='#']").unbind("click");/*先消除点击事件,避免多次触发*/

                                          $(".bdshare_popup_list a[href='#']").one("click", function () {

                                              shareRecord($(this).attr("class"), document.location.href);

                                          });

                                          $(".popup_more").unbind("click");/*先消除点击事件,避免多次触发*/

                                          $(".popup_more").one("click", function () {

                                              setTimeout(bindbdshare_dialog, 600);/*点击时等待弹出框加载后绑定事件*/

                                          });

                                      });

                                      /*绑定分享弹出框事件*/

                                      function bindbdshare_dialog() {

                                          $(".bdshare_dialog_list a[href='#']").unbind("click");

                                          $(".bdshare_dialog_list a[href='#']").bind("click", function () {

                                              shareRecord($(this).attr("class"), document.location.href);

                                          });

                                      }

                                      /*记录分享信息 type:分享目标 link:分享链接*/

                                      function shareRecord(type, link) {

                                          var rnd;

                                          with (Math) {

                                              rnd = floor(random() * 1000000);

                                          }

                                          $.ajax({

                                              type: "Get",

                                              url: "/Ajax/DefaultAjax.ashx",

                                              data: "action=share&type=" + type + "&link=" + link + "&rnd=" + rnd,

                                              success: function (result) {

                                                  //记录成功

                                              },

                                              error: function () {

                                                  //错误处理

                                              }

                                          });

                                      }

                                </script>

                                <!-- Baidu Button END -->

 

使用时,可以直接全部复制到想要实现分享功能的页面,并将alert事件替换为自己想要执行的操作。

 

之前没有仔细研究百度分享的资料,现在已发现在common配置中调用 onAfterClick: function (cmd) { alert(cmd); } 即可实现。

失误,失误,自己写的方法还是保留一下做个纪念吧

你可能感兴趣的:(百度)