Question

我正在创建一个Web应用程序，用户可以在页面中插入Facebook Like按钮。他点击“插入Facebook赞”并插入小部件代码，如下所示：

<div id="fb-root"></div>' +
        '<script>(function(d, s, id) {' +
        'var js, fjs = d.getElementsByTagName(s)[0];' +
        'if (d.getElementById(id)) {return;}' +
        'js = d.createElement(s); js.id = id;' +
        'js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";' +
        'fjs.parentNode.insertBefore(js, fjs);' +
        '}(document, \'script\', \'facebook-jssdk\'));</script>' +
        '<div class="fb-like" data-href="' + field.url + '" data-send="true" data-width="369" data-show-faces="true"></div>

然后，用户单击“编辑窗口小部件”按钮，并看到带有URL的文本输入。他填写了他想要的任何网址，然后点击“保存”。在此data-href获取网址后。以上所有内容都可以正常工作，但更新网址时窗口小部件不会重新加载。我想我应该调用一些方法重新加载小部件。我该怎么办？

Answer 1

据我所知，data-href属性在执行上面的脚本时会被读取一次。并且div本身就成了一个容器，并且在脚本执行后实际上并没有在Like过程中扮演任何角色。

您可以尝试使用XFBML Like-button。

<fb:like href="http://example.com" send="true" width="450" show_faces="true"></fb:like>

当用户更改URL时，您只需销毁现有的Like按钮，插入更新的XFBML，然后使用Facebook's JavaScript SDK，调用FB.XFBML.parse重新创建它。

以编程方式更改data-href属性后重新加载Facebook Like小部件

1 个答案: