百度分享异步加载问题、分页，无效果解决[通俗易懂]

全栈程序员-站长 • 2022年10月8日上午10:36 • 未分类 • 阅读 6

大家好，又见面了，我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用
使用百度分享的时候，如果所涉及到的html部分是后加载进来的，如ajax等异步请求成功后，加载进来，那么百度分享就有可能出现错误。

我在使用的时候，遇到了两个问题。在这里记录一下。

1、无法把所需要分享的内容传值到百度分享里。

百度分享的配置里有两个值，bdText，bdDesc，这两个内容，分别分享标题和内容。

内容是异步加载进来的，所以在百度分享相关代码是在加载成功后运行的。但是，在使用中，始终无法将想分享的内容，传值给bdText，bdDesc。

后来，在百度分享的api里发现了一个事件：onBeforeClick，在分享前的点击事件。于是我就先获取鼠标所在元素，然后在onBeforeClick事件里，根据鼠标所在元素定位获取到所需要分享的内容，进行传值。

2、分页时，百度分享无效。

当点击到第二个及以后时，百度分享无效。通过百度查，网上 hupan508给出了解决方案。因为百度分享执行后，会创建全局的window.__bd_share_main，所以需要在 ajax请求完成后执行一下：window.__bd_share_main.init(); 根据这个解决方案，最终解决了问题。

var ele；
var bdTitle；
var bdAbstract;

  $(document).mouseover(function (e) {
        ele = e.target;
    });
    //设置分享
    function beforeShareClick(cmd, config, bdTitle, bdAbstract) {
        
        // 根据ele，获取 bdTitle, bdAbstract的值
        
        
        //设置 config
        if (shareTitle) {
            config.bdText = bdTitle;
            config.bdDesc = bdAbstract;

        }
        return config;
    }

    //百度分享代码，放入 ajax请求成功后执行
    function baiduShare(){
        if(window._bd_share_main){          //先执行初始化bdshare
            window._bd_share_main.init();
        }                                     

        window._bd_share_config = {
            common: {
                onBeforeClick: beforeShareClick,
                bdText: bdTitle,
                bdDesc: bdAbstract,
                bdUrl: window.location.href
            }
        };
        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)];
    }

发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/184643.html原文链接：https://javaforall.net