[英]Hide the FB Login button if user already logged in
This seems like a simple problem and others have posted but the answer still eludes me. 这似乎是一个简单的问题,其他人已经发布了,但是答案仍然使我难以理解。 Specifically I have been through these two ( here and here ) SO questions repeatedly and I'm just not making the connection to my situation.
具体来说,我反复地经历了这两个( 这里和这里 )SO问题,而我只是没有与自己的情况建立联系。
For me I thought I would wrap the login button in a div and then change the div visibility based upon login status. 对我来说,我想将登录按钮包装在div中,然后根据登录状态更改div可见性。 The div does indeed change visibilty but the fb login button remains visible???
div确实确实改变了可见性,但是fb登录按钮仍然可见???
Here is my code for wrapping the login button in the div: 这是我的将登录按钮包装在div中的代码:
....snip....
<div id="fblogin">
<table align="center" style="text-align:center;">
<tr>........</tr>
<tr>
<td>
<div id="fb-root"></div>
<span id="fb-login">
<div
class="fb-login-button"
onlogin="afterFbLogin()"
data-show-faces="false"
data-width="200"
data-max-rows="1"
data-scope="publish_stream">
</div>
</span>
............snip.............
here is my FB.Init and checking for logged in status: 这是我的FB.Init,并检查登录状态:
window.fbAsyncInit = function () {
FB.init({
appId: '352810974851050', // App ID
channelUrl: '//www.domain.com/channel.html',
status: true, // check login status
cookie: true, // enable cookies
xfbml: true // parse page for xfbml or html5 like login button below
});
// Put additional init code here
FB.getLoginStatus(function (response) {
if (response.status === 'connected') {
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
ShowFbLogin(false);
} else if (response.status === 'not_authorized')
.........snip...................
and the js code for the ShowFbLogin function 和ShowFbLogin函数的js代码
function ShowFbLogin(ShowLogin)
{
var div_FBLogin = document.getElementById('fblogin');
var spn_FBLogin = document.getElementById('fb-login');
var div_FBShare = document.getElementById('fbshare');
if (ShowLogin)
{
div_FBLogin.style.visibility = 'visible';
div_FBShare.style.visibility = 'hidden';
}
else
{
div_FBLogin.style.visibility = 'collapse';
spn_FBLogin.style.visibility = 'collapse';
div_FBShare.style.visibility = 'visible';
}
}
Try instead using display: none
for the #fb-login
element. 尝试使用
display: none
#fb-login
元素不使用。 visibility: collapse
is for table elements; visibility: collapse
用于表元素; should act like visibility hidden, that is, reserve space for the invisible button. 应该就像隐藏可见性一样,即为不可见按钮保留空间。
visibility: collapse
also doesn't work for IE8 at all. visibility: collapse
对于IE8也完全不起作用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.