百度分享插件开发文档部分常用摘录

最新推荐文章于 2022-05-20 15:20:03 发布

weixin_30619101

最新推荐文章于 2022-05-20 15:20:03 发布

阅读量91

点赞数

原文链接：http://www.cnblogs.com/ssbfs/p/9681849.html

版权

以下是通用的一些配置项：具体信息详见专业开发版文档

配置项名称	值类型	格式和取值	描述
bdText	String	自定义	分享的内容
bdDesc	String	自定义	分享的摘要
bdUrl	String	自定义	分享的Url地址
bdPic	String	自定义	分享的图片
bdSign	String	on｜off｜normal	是否进行回流统计。 'on': 默认值，使用正常方式挂载回流签名（#[数字签名]） 'off': 关闭数字签名，不统计回流量 'normal': 使用&符号连接数字签名，不破坏原始url中的#锚点
bdMini	int	1｜2｜3	下拉浮层中分享按钮的列数
bdMiniList	array	['qzone','tsina',...]	自定义下拉浮层中的分享按钮类型和排列顺序。详见分享媒体id对应表
onBeforeClick	function	function(cmd,config){}	在用户点击分享按钮时执行代码，更改配置。 cmd为分享目标id，config为当前设置，返回值为更新后的设置。
onAfterClick	function	function(cmd){}	在用户点击分享按钮后执行代码，cmd为分享目标id。可用于统计等。
bdPopupOffsetLeft	int	正｜负数	下拉浮层的y偏移量。
bdPopupOffsetTop	int	正｜负数	下拉浮层的x偏移量。

通用设置的使用：

<script>
    window._bd_share_config = {
        common : {        
            bdText : '',    
            bdDesc : '',    
            bdUrl : '',     
            bdPic : '',        
            ...
        }
    }
</script>

加载js：

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

按钮标签代码：

<div class="bdsharebuttonbox" data-tag="share_1">
    <a class="bds_mshare" data-cmd="mshare"></a>
    <a class="bds_qzone" data-cmd="qzone" href="#"></a>
    <a class="bds_tsina" data-cmd="tsina"></a>
    <a class="bds_baidu" data-cmd="baidu"></a>
    <a class="bds_renren" data-cmd="renren"></a>
    <a class="bds_tqq" data-cmd="tqq"></a>
    <a class="bds_more" data-cmd="more">更多</a>
    <a class="bds_count" data-cmd="count"></a>
</div>

说明：

1.只有普通页面分享需要按钮标签。划词分享、图片分享无需添加HTML结构。

2.HTML结构可以放在body的任意位置，可复制多份。

3.class＝"bdsharebuttonbox" 部分为dom选择器，请勿改动。

4.data-tag属性为分享按钮标识，用于实现同一页面中多分享按钮不同配置，详见设置部分。

5.data-cmd属性为分享目标标识，取值请参见：分享媒体id对应表。此外值为more时点击展现更多弹窗，值为count时展现分享数。

6.HTML代码中其他部分均可自定义。

【注】：实际使用时，我们常将通用配置和加载JS放置在$(function(){})函数中执行，这就造成当需要用ajax重新加载数据的时候（查询、翻页等），会出现分享按钮无效或者无法显示的问题的问题。这是因为百度分享的代码只会执行一次，所以造成ajax加载的内容中分享按钮无法获取，也无法为其注册事件的问题。这时候需要做的是重新初始化插件代码。在官方的源代码中，初始化函数为 :

_bd_share_main.init();

所以我们只需要在ajax加载页面完成之后，在相应方法后面加上

window._bd_share_main.init();

即可在每次加载页面完成之后重新初始化。

【注】：在实际使用中，会遇到页面多条分享需要动态变更bdUrl等问题，以及在分享时，会出现自动添加分享描述的BUG，可以用以下方法解决（后期使用时发现，如果拼接summary时，使用&有时会出现分享链接跳转错误的情况，未发现具体原因，后改为#。使用时可以根据情况自己判断）。

window._bd_share_config = {
　　"common" : {
　　　　"bdMini" : "2",
　　　　"bdMiniList" : false,
　　　　"bdPic" : "默认图片的url",
　　　　"bdStyle" : "0",
　　　　"bdSize" : "16",
　　　　"onBeforeClick":setConf //分享前事件
　　},
　　"share" : {}
};

//声明全局变量
var shareHref = "",title="";
function setConf(cmd, config) {
    if (shareHref) {
　　　　// summary为分享的描述
        config.bdUrl = shareHref +'#summary=""';
        config.bdText = title;
    }
    return config;
}

//绑定动态方法获取相应的分享参数
$(".bdsharebuttonbox a").mouseover(function () {
    shareHref = $(this).attr("href");
    title = $(this).parent().attr("title");
});