使用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、显示效果
相关文章推荐
- sql中使用cmd命令注销登录用户
- 使用Jquery打造最佳用户体验的登录页面的实现代码
- 完成注销 登录限制过滤 添加用户
- Flask -- 使用数据库(Sqlite3)、用户注册、登录注销、修改密码
- 使用nodejs、mongodb、express、linux搭建社区网站(5)-用户登录及个人主页
- 添加用户登录使用飞信机器人报警
- 使用jQuery插件实现添加用户
- Easyui + MVC 系列教程 第19-23 节 完成注销 登录限制过滤 添加用户
- 使用xp_cmdshell注销Windows登录用户(终端服务器超出最大连接数)
- 使用jquery.cookie.js实现记住用户信息(下面以web的记住登录名和密码为例进行说明)
- 使用jquery1.2.6验证用户登录和注册总结
- 使用jQuery动态创建一个表格(根据用户输入的内容添加一行数据,并且能逐行删除)
- 使用Jquery搭建最佳用户体验的登录页面之记住密码自动登录功能(含后台代码)
- 使用Jquery搭建最佳用户体验的登录页面 之 记住密码自动登录功能
- 在ASP.NET AJAX中使用应用程序服务和本地化:实现用户登录和注销(转自:Dflying Chen @ cnblogs)
- 使用Jquery搭建最佳用户体验的登录页面。(优化点点网登录页面)
- ASP.NET jQuery 实例11 通过使用jQuery validation插件简单实现用户登录页面验证功能
- 牛腩购物13: 整合用户资料修改 用户修改密码 asp.net登陆控件的使用(登录前 登陆后) 显示登录名 显示注销按钮
- cURL 学习笔记与总结(3)模拟登录博客园并下载个人随笔首页
- 如何在服务器上添加使用密钥登录的用户