您的位置:首页 > Web前端 > JQuery

使用jquery为个人博客园首页公告栏添加用户登录与注销

2016-09-16 23:55 369 查看
  未登录前,注销的字体颜色为黑色,登录后,登录的字体为蓝色。

1、在公告栏添加布局显示代码

<!--显示登录 Begin-->
<!--   隐藏调用html代码-->
<div class="hide">
<!--------------------------用户登陆前后显示------------------------------->
<div class="login_message " style="display: none;"></div>
<div >
<a id="lnkLogin">hi,请登录</a> -
<a href="https://ing.cnblogs.com/" target="_blank">闪存</a> -
<a href="http://msg.cnblogs.com/inbox" target="_blank">消息</a> -
<a id="lnkLoginout">注销</a></br>
</div>
</div>
<!-------------------------用户登陆前后显示结束---------------------------->
</div>
<!--   隐藏调用html代码end-->


2、在布局后添加js代码

<!--******js代码开始******-->
<script type="text/javascript">
$(document).ready(function(){
//***************全局变量*************
var dangqurl=window.location.href;  //获取当前url
var loginy ;   // 登陆状态        1为已登录         0为未登陆
//ajax获取设置登录信息
$.ajax({
url:"http://www.cnblogs.com/GetLoginInfo.aspx",
data:'{}',
type: 'post',
async: false,
dataType: 'text',
contentType: 'application/json; charset=utf-8',
success: function (data){
if (data) {
var reset=data.replace(/document\.write\(\"/g,"").replace(/\"\)\;/,"").replace(/\[ /,"").replace(/\]/,"");
$(".login_message").html(reset);
loginz=$(".login_message").find("a:first").html();
bkurl= $(".login_message").find("a:first").attr("href");
//登录设置
if(loginz !="登录"){
$(".headTopRight").html($(".ylogin").html());
loginy=1  //设置登录状态
login_name=loginz;
//获取博客地址
var bokarr=new Array();
bokarr=bkurl.split("/");
bok_link=bokarr[3];
$(".login_namez").html(loginz);
$(".login_namez").attr("href","http://www.cnblogs.com/"+bok_link);
$(".login_namez1").attr("href","http://www.cnblogs.com/"+bok_link);
$("#lnkLoginout").attr("href","http://passport.cnblogs.com/logout.aspx?ReturnUrl="+dangqurl);
window.location_href=dangqurl;
$(".wdyz").attr("href","http://home.cnblogs.com/u/"+bok_link);
}
if(loginz=="登录"){
$(".headTopRight").html($(".nlogin").html());
loginy=0  //设置登录状态
$("#lnkLogin").attr("href","http://passport.cnblogs.com/login.aspx?ReturnUrl="+dangqurl);
window.location_href=dangqurl;
}
//登录 设置结束
}
},
erro:function (){
loginy=0;
login_type="user";
$(".login_main").html($(".nlogin").html());
$("#lnkLogin").attr("href","http://passport.cnblogs.com/login.aspx?ReturnUrl="+dangqurl);
window.location_href=dangqurl;
}
});
//获取登录信息结束
});
</script>
<!--显示登录 End-->


3、显示效果

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐