我有这个脚本,我把它放在 GWT nocache.js 之上
<head>
<script type="text/javascript" language="javascript">
(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>
<script type="text/javascript" language="javascript" src="app/app.nocache.js"></script>
</head>
<body>
<div id="fb-root"></div>
<div id="rootPanel"></div>
</body>
在我的网站的其中一个页面上(我使用 Errai-UI)
添加此内容:
HTMLPanel likebox = new HTMLPanel("<div class='fb-like-box' " +
"data-href='http://www.facebook.com/platform' data-width='595' " +
"data-show-faces='true' data-stream='true' data-header='true'></div>");
likepanel.add(likebox);
我面临的问题是,在我的 GWT 应用程序中,当网站登陆到注入(inject)此面板的页面时,即使我查看 DOM、<div class='like-box' ...>
,Facebook 之类的框也不会被渲染。 DOM 树中是否存在。
有效的是我需要在当前页面上进行全页面刷新(在 DevMode 中):示例:/mysite#PageWithFBDiv
此外,页面刷新技巧仅在 DevMode 下有效,但在编译时无法实现该技巧。
最佳答案
根据 Facebook Javascript SDK 文档,有必要将 div 放置在页面顶部,即脚本上方。
JavaScript SDK 要求页面中存在 fb-root 元素。
不得使用display:none或visibility:hidden来 Conceal fb-root元素,否则SDK的某些部分将无法在Internet Explorer中正常工作。
SDK 将元素插入到 fb-root 中,这些元素期望相对于正文或相对于靠近页面顶部的元素定位。最好 fb-root 元素不在具有position:absolute 或position:relative 的元素内部。如果您必须将 fb-root 元素放置在定位元素内,那么您还应该将其放置在靠近主体顶部的位置,否则 SDK 的某些部分可能无法正常工作。
此代码应直接放置在开始标记之后。
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'YOUR_APP_ID', // App ID from the App Dashboard
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File for x-domain communication
status : true, // check the login status upon init?
cookie : true, // set sessions cookies to allow your server to access the session?
xfbml : true // parse XFBML tags on this page?
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK's source Asynchronously
// Note that the debug version is being actively developed and might
// contain some type checks that are overly strict.
// Please report such bugs using the bugs tool.
(function(d, debug){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
ref.parentNode.insertBefore(js, ref);
}(document, /*debug*/ false));
</script>
关于java - Facebook DIV 未在页面上呈现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15539454/