DedeCMS中实现在顶层banner中显示自定义登录信息
来源:互联网 发布:期货交易者软件怎么样 编辑:程序博客网 时间:2024/05/16 06:24
转载请标明是引用于 http://blog.csdn.net/chenyujing5678
欢迎拍砖!
一、需求描述
dedeCMS自带的模板中有互动中心模块,如下图所示:
由于会员登陆对我来说不是网站的重要模块且默认DedeCMS的会员中心模块的初始化很慢,常会显示“正在载入中,请稍候。。。”,
所以不想让它出现在首页上,而是想在顶层banner中显示自定义登录信息,如下图所示:
二、原理分析
我们来分析一下DedeCSM自带的模板是怎么实现会员中心及登录信息显示的内容的:
1、index.htm中定义了用户名密码模块:
<dd id="uc_member" > <div id="_userlogin"> <div class="userlogin"> <form name="userlogin" action="{dede:global.cfg_memberurl/}/index_do.php" method="POST"> <input type="hidden" name="fmdo" value="login" /> <input type="hidden" name="dopost" value="login" /> <input type="hidden" name="keeptime" value="604800" /> <div class="fb"><span>用户名:</span> <input type="text" name="userid" size="20" class="ipt-txt" /> </div> <div class="fb"><span>密码:</span> <input type="password" name="pwd" size="20" class="ipt-txt" /> </div> {dede:php} if(preg_match("#2#", $safe_gdopen)) { echo ' <div class="fb"><span>验证码:</span> <input type="text" name="vdcode" size="8" class="ipt-txt" /> <img id="vdimgck" align="absmiddle" onClick="this.src=this.src+\'?\'" style="cursor:pointer;margin-left:0px;text-transform:uppercase;" alt="看不清?点击更换" src="'.$cfg_cmspath.'/include/vdimgck.php"/></div> '; } {/dede:php} <div class="submit"> <button type="submit" class="btn-1">登录</button> <a href="{dede:global.cfg_memberurl/}/index_do.php?fmdo=user&dopost=regnew" >注册帐号</a> <a href="{dede:global.cfg_memberurl/}/resetpassword.php">忘记密码?</a> </div> </form> </div> </div> <!-- /userlogin --> <script language="javascript" type="text/javascript">CheckLogin();</script> <div class="latestlogin"> <strong>最近登陆的会员</strong> <ul class="e7"> {dede:memberlist row=6 signlen=30} <li><a href="[field:spaceurl/]" target="_blank"><img src="[field:face/]" alt='[field:spacename/]' width="52" height="52" />[field:uname/]</a></li> {/dede:memberlist} </ul> </div> <!-- /latestlogin --> </dd>
从以上代码可以看出它只是显示一个界面而与,那么当我们输入用户名、密码,点登录后是怎么变为如下的结果呢:
2、在上面的代码中点了登录按钮后,由于没有指定button的onclick响应函数,所以默认submit会有一个跳转,页面会刷新。
当页面刷新时,就把index.htm的HTML再次执行一次。在上面代码的下面有这么一行代码:
<!-- /userlogin --> <script language="javascript" type="text/javascript">CheckLogin();</script>
3、我们来看CheckLogin()的定义,它出现在index.htm的head区:
<link href="{dede:global.cfg_templets_skin/}/style/dedecms.css" rel="stylesheet" media="screen" type="text/css" /><script language="javascript" type="text/javascript" src="{dede:global.cfg_cmsurl/}/include/dedeajax2.js"></script><script language="javascript" type="text/javascript" src="{dede:global.cfg_cmspath/}/images/js/j.js" ></script><script language="javascript" type="text/javascript" src="{dede:global.cfg_templets_skin/}/js/pic_scroll.js"></script><script language="javascript" type="text/javascript"><!--$(function(){$("a[_for]").mouseover(function(){$(this).parents().children("a[_for]").removeClass("thisclass").parents().children("dd").hide();$(this).addClass("thisclass").blur();$("#"+$(this).attr("_for")).show();});$("a[_for=uc_member]").mouseover();$("a[_for=flink_1]").mouseover();});function CheckLogin(){ var taget_obj = document.getElementById('_userlogin'); myajax = new DedeAjax(taget_obj,false,false,'','',''); myajax.SendGet2("{dede:global.cfg_cmspath/}/member/ajax_loginsta.php"); DedeXHTTP = null;}--></script>
CheckLogin()首先获得id为'_userlogin'的网页元素,其实这个元素就是我们的用户名密码登录模块;
然后调用DedeAjax函数,这个函数定义在{dede:global.cfg_cmsurl/}/include/dedeajax2.js文件(所以在前面引入了引javascript文件)
//gcontainer 是保存下载完成的内容的容器//mShowError 是否提示错误信息//DedeShowWait 是否提示等待信息//mErrCon 服务器返回什么字符串视为错误//mErrDisplay 发生错误时显示的信息//mWaitDisplay 等待时提示信息//默认调用 DedeAjax('divid',false,false,'','','')function DedeAjax(gcontainer,mShowError,mShowWait,mErrCon,mErrDisplay,mWaitDisplay){
//用GET方式发送数据,阻塞模式this.SendGet2 = function(purl) {
从以上我们知道为什么能显示登录结果的原因了:
通过调用通讯模块dedeajax2.js的功能根据{dede:global.cfg_cmspath/}/member/ajax_loginsta.php返回结果网页代码,然后在id为"_userlogin'"的地方显示。
ajax_loginsta.php的一部分代码如下:
require_once(dirname(__FILE__)."/config.php");AjaxHead();if($myurl == '') exit('');$uid = $cfg_ml->M_LoginID;!$cfg_ml->fields['face'] && $face = ($cfg_ml->fields['sex'] == '女')? 'dfgirl' : 'dfboy';$facepic = empty($face)? $cfg_ml->fields['face'] : $GLOBALS['cfg_memberurl'].'/templets/images/'.$face.'.png';?><div class="userinfo"> <div class="welcome">你好:<strong><?php echo $cfg_ml->M_UserName; ?></strong>,欢迎登录 </div> <div class="userface"> <a href="<?php echo $cfg_memberurl; ?>/index.php"><img src="<?php echo $facepic;?>" width="52" height="52" /></a> </div> <div class="mylink"> <ul> <li><a href="<?php echo $cfg_memberurl; ?>/guestbook_admin.php">我的留言</a></li> <li><a href="<?php echo $cfg_memberurl; ?>/mystow.php">我的收藏</a></li> <li><a href="<?php echo $cfg_memberurl; ?>/article_add.php">发表文章</a></li> <li><a href="<?php echo $cfg_memberurl; ?>/myfriend.php">好友管理</a></li> <li><a href="<?php echo $cfg_memberurl; ?>/visit-history.php">访客记录</a></li> <li><a href="<?php echo $cfg_memberurl; ?>/search.php">查找好友</a></li> </ul> </div> <div class="uclink"> <a href="<?php echo $cfg_memberurl; ?>/index.php">会员中心</a> | <a href="<?php echo $cfg_memberurl; ?>/edit_fullinfo.php">资料</a> | <a href="<?php echo $myurl;?>">空间</a> | <a href="<?php echo $cfg_memberurl; ?>/index_do.php?fmdo=login&dopost=exit">退出登录</a> </div></div><!-- /userinfo -->
以上代码定义了我们看到的登录结果的样式。
三、修改代码
知道了显示的原理,接下来我们开始实现我们的功能:
1、定义显示的地方,并指定id。
在head.htm中添加:
<!----><div class="header_top"> <div class="w960 center"> <div id="_userlogin_head"></div><div class="toplinks">欢迎来到本网站, 请 <a href="{dede:global.cfg_memberurl/}/login.php" target="_blank">登录</a> |<a href="{dede:global.cfg_memberurl/}/index_do.php?fmdo=user&dopost=regnew" target="_blank">注册</a></div><!--/toplinks--></div> </div>
2、添加javascript执行
<script language="javascript" type="text/javascript">CheckLogin_head();</script>
3、自义javascript的CheckLogin_head()函数
为了使代码模块化,我们定义在head.htm里。
注意:得重新包含dedeajax2.js和j.js文件,因为虽然我们之前在index.htm中定义过了,但是是引用不到的。
<script language="javascript" type="text/javascript" src="{dede:global.cfg_cmsurl/}/include/dedeajax2.js"></script><script language="javascript" type="text/javascript" src="{dede:global.cfg_templets_skin/}/js/j.js" ></script><SCRIPT language=javascript type=text/javascript><!--function CheckLogin_head(){ var taget_obj_head = document.getElementById('_userlogin_head'); myajax_head = new DedeAjax(taget_obj_head,false,false,'','',''); myajax_head.SendGet2("{dede:global.cfg_cmspath/}/member/ajax_loginsta_head.php"); DedeXHTTP = null;}--></SCRIPT>
4、其实第3步大家有注意到了我们是根据ajax_loginsta_head.php文件来获得结果HTML代码的。
ajax_loginsta_head.php文件是由ajax_loginsta.php 复制粘贴出来的,我们在它的基础上改为:
require_once(dirname(__FILE__)."/config.php");AjaxHead();if($myurl == '') exit('');$uid = $cfg_ml->M_LoginID;!$cfg_ml->fields['face'] && $face = ($cfg_ml->fields['sex'] == '女')? 'dfgirl' : 'dfboy';$facepic = empty($face)? $cfg_ml->fields['face'] : $GLOBALS['cfg_memberurl'].'/templets/images/'.$face.'.png';?><div class="userinfo"><script type="text/javascript">var now=(new Date()).getHours();if(now>0&&now<=6){document.write("午夜好,");}else if(now>6&&now<=11){document.write("早上好,");}else if(now>11&&now<=14){document.write("中午好,");}else if(now>14&&now<=18){document.write("下午好,");}else{document.write("晚上好,");}</script> 你好:<strong><?php echo $cfg_ml->M_UserName; ?></strong>,欢迎登录 <a href="<?php echo $cfg_memberurl; ?>/index_do.php?fmdo=login&dopost=exit">退出登录</a> </div><!-- /userinfo -->
OK,效果显示出来了。
四、不足
不知什么原因ajax_loginsta_head.php想显示“午夜好”“早上好”“中午好”。。。。的javascript代码,可是并没有显示出来,
由于本人刚开始研究代码,可能只是个小问题而已。如果你知道答案,请告诉我,谢谢!!!QQ:594462206
- DedeCMS中实现在顶层banner中显示自定义登录信息
- 登录信息失效,登录界面显示在frame中
- dedecms用户登录信息显示
- 在DEDECMS后台管理文档列表中,需要在列表中显示自定义的字段内容
- 编写SESSION过滤器时,SESSION失效时,登录页在顶层TOP中显示SHOW出的问题
- 在全局页面缓存中显示登录信息
- Dedecms在循环列表中获取会员信息
- 在面板中显示信息
- dedecms中实现列表页面调用其它栏目的信息
- AD9中如何让KEEPOUT层或者相关的层显示的时候显示在顶层
- dedecms中添加自定义函数
- windows2008登录过程中显示历史登录信息
- 在自定义对话框中显示Gallery的效果实现
- Xamarin.Android中实现登录信息保存
- 在WordPress主题中显示登录框
- 登录页面显示在嵌套iframe中
- servlet中监听器listener实现在线登录人数与在线的人员信息显示(ip地址,sessionid,登录时间)
- 实现在DeDeCMS/FCKeditor中插入flv视频
- 程序员技术练级攻略
- 内联函数,构造函数,静态函数都不能是虚函数
- 基于haar分类器特征提取及检测图像全过程(V0.1)
- Objective-C 使用MySQL数据库的教程
- 看Nokia五年之内如何挥发掉千亿市值
- DedeCMS中实现在顶层banner中显示自定义登录信息
- Decorator装饰器模式Java示例学习
- K-Means 算法
- Oracle之scott用户表、相关SQL语句
- hdu3032 Nim or not Nim?-----sg打表找规律 允许把一堆石子分成两堆小的
- 对技术的态度
- gacutil.exe
- 黑马程序员-java基础之TCP传输客户端与服务端常用代码
- IE6 PNG透明终极解决方案