本站已年久失修,技术交流可以移步到 https://blog.pyzy.net
  所在位置:杂记 >> javascript >> 百度分享按钮自定义扩展
百度分享按钮自定义扩展
发表于 十一年前(2012-6-21 1:50:20) | 阅读 (3022) | 评论 (0)
工作中用到的是更灵活、简单可依赖的服务端包装,基于服务端差异,这里放出客户端实现原理。

稍后整理....

<script type="text/javascript">
   
var bds_config = { /* 使用者关注这个config配置即可 */         "snsKey": {
           
"tsina": "weiboKey",
           
"tqq": "tqqKey"
       
},
       
"bdText": "哇啦乌拉啦啦啦啦啦,分享给你看。",
       
"wbUid": 1234567,
       
"bdTop": 200,
       
"bdPic": "http://xxxx.xxxx/aaaa.jpg",
       
"tsina": { /* 针对新浪的分享配置,使用站点别名作为key然后设定相应值(【如何知道各站点对应别名】可以在引用百度分享按钮的页面中 Console 中执行“for(var i=0,s=bdShare.fn.conf.bdList,t,l=s.length;i<l;i++){t=s[i].split(',');console.log(t[1]+':'+t[0]); }”) */
            "wbUid": "",
            "bdText": "啦啦啦啦乌拉拉,一起来看看吧。",
            "atUname": "@飞翔-hu"
        }
    };
    document.getElementById("bdshell_js").src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?t=" + new Date().getHours();

    /* 百度分享功能包装扩展 huzj */
    //{{start:compress
    function bdShareForLeho(winIsLoaded) {

        var _bds = window.bdShare,
            /*百度分享命名空间*/
            _bdsConf = (_bds && _bds.fn && _bds.fn.conf),
            /*百度分享配置信息*/
            _bdsSiteList = (_bdsConf && _bdsConf.bdList); /*百度分享支持的站点列表*/
        if (_bdsSiteList || winIsLoaded) {
            bdShareForLeho = new Function(); /*避免重复执行*/
        } else {
            var callFun = arguments.callee;
            return window.setTimeout(function () {
                callFun();
            }, 200); /*避免当前页面被BT请求阻塞时,半天不到window.onload*/
        }

        /*针对所有可能存在的各个目的站点分享按钮,以事件代理的方式处理特定文本需求*/
        if (_bdsSiteList) {

            var bodyW = W('body'),
                getBDSboxW = function (el) {
                    return el._lh_pW = el._lh_pW || W(el).parentNode('[id^=bdshare]').first();
                },
                /* 修改百度分享配置 */
                changeBdsConf = function (config, el) {
                    for (var p in config) {
                        if (/^(bdPopTitle|bdText|bdPic|wbUid|tongji|render|snsKey|review|bdComment|bdDesc|bdTop|searchPic|bdUrl|bdMiniWindow|atUname)$/.test(p)) {
                            _bdsConf[p] = config[p];
                            if (!/^(render|snsKey|bdPopTitle)$/.test(p)) {
                                if ((p == 'atUname' && !('bdText' in config)) || p == 'bdText') {
                                    var atUname = config.atUname || '';
                                    _bdsConf.bdText = encodeURIComponent(decodeURIComponent(_bdsConf.bdText).subByte(200 - atUname.byteLen(), '...') + atUname);
                                } else {
                                    _bdsConf[p] = encodeURIComponent(_bdsConf[p]);
                                }
                            }
                        }
                    }
                    if (el && config.bdUrl) { /* 自定义URL竟然和其他conf规则不一致.... */
                        getBDSboxW(el) && el._lh_pW.attr('data', '{url:"' + config.bdUrl + '"}')
                    }
                },
                /* 按传入内容改写百度分享配置信息,并将默认值缓存起来 */
                setConf = function (siteConf, el) {
                    resetConf(el); /* 先恢复到默认一下 */
                    bds_config._is_siteConf = true;
                    changeBdsConf(siteConf, el);
                },
                /* 重置百度分享配置信息到默认值 */
                resetConf = function (el) {
                    if (bds_config._is_siteConf || (el && bds_config.bdUrl && getBDSboxW(el) && el._lh_pW.attr('data') == null)) {
                        bds_config._is_siteConf = false;
                        changeBdsConf(bds_config, el);
                    }
                },
                /*校验是否要前往百度搜藏,如果是则判断文本内容是否超出搜藏38个汉字的限制*/
                bdLenCheck = function (siteAlias) {
                    if (siteAlias == 'baidu') {
                        var bdText = decodeURIComponent(_bdsConf.bdText);
                        bdText.byteLen() > 76 && setConf({
                            bdText: bdText.subByte(76, '...')
                        });
                    }
                },
                i = 0,
                l = _bdsSiteList.length,
                siteInfo, siteAlias;

            for (; i < l; i++) {
                siteInfo = (_bdsSiteList[i] + '').split(',');
                siteAlias = siteInfo[0];
                /* 通过在body上代理mousedown事件,用以改写分享功能所需的全局配置为目标内容 */

                bodyW.delegate('.bds_' + siteAlias, 'mousedown', (function (siteConf, sA) {
                    return siteConf ?
                    function () {
                        setConf(siteConf, this); //设置分享信息为当前站点配置内容
                        bdLenCheck(sA);
                    } : function () {
                        resetConf(this); //重置分享信息为默认内容
                        bdLenCheck(sA);
                    }
                })(bds_config[siteAlias], siteAlias));
            }

        }
    }

    bdShareForLeho();
    W(window).on('load', function () {
        bdShareForLeho('loaded')
    });

    //}}end:compress
</script>
杂记评论(0):
称谓(必填):  网站(选填):
上一篇:使用新浪云平台实现站点缓存  下一篇:linux环境Apache的编译安装过程     <<返回杂记列表