ecshop商城网站顶部会员如何实现ajax免刷新登录登出
更新时间:2016-06-27 点击量:1415
Tag关键词: 登录 ecshop模板 ecshop4.0模板 二次开发 ecshop3.6模板 ecshop小程序
ecshop可以在网站头部或者是在首页实现无刷新的ajax登录登出效果,代码如下
只需找到themes/我的模板名称/library/member_info.lbi,将里面的代码用下面的代码替换即可,样式您可以根据自己的网站风格进行调整
<!--{if $user_info}--> <div class="lef_tit_bj">会员登陆</div> <div class="left_conn_bj"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="50" align="center" valign="middle"><label><strong>Hello {$user_info.username}</strong></label></td> </tr> <tr> <td height="30" align="center" valign="middle"><strong>欢迎光临本店</strong></td> </tr> <tr> <td height="40" align="center" valign="bottom"><label> <a href="user.php?act=logout"> <img src="../images/tuichu.gif"></a> <a href="user.php"> <img src="../images/jinrultan.gif"></a> </label></td> </tr> </table> </div> </div> <!--{else}--> <div class="lef_tit_bj">会员登录</div> <div class="left_conn_bj"> <form id="ECS_LOGINFORM" name="ECS_LOGINFORM" method="post" action="javascript:signIn()"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="50" align="right" valign="middle">用户名:</td> <td height="50" align="left" valign="middle"><label> <input type="text" name="username" class="yonhu_input" style="height:15px;"/> </label></td> </tr> <tr> <td height="30" align="right" valign="middle"> 密 码:</td> <td height="30" align="left" valign="middle"><input type="password" name="password" class="yonhu_input" style="height:15px;" /></td> </tr> <tr> <td height="40" colspan="2" align="center" valign="bottom"><label> <input type="image" name="imageField" src="images/denglu_bann.jpg" /> <a href="user.php?act=register"><img src="images/zhuce_bann.jpg" border="0" /></a> </label></td> </tr> </table> </form> </div> </div> <!--{/if}--> {literal} <script type="text/javascript"> function signIn() { var frm = document.forms['ECS_LOGINFORM']; if (frm) { var username = frm.elements['username'].value; var password = frm.elements['password'].value; var captcha = ''; if (frm.elements['captcha']) { captcha = frm.elements['captcha'].value; } if (username.length == 0 || password.length == 0) { {/literal} alert("{$lang.empty_username_password}"); {literal} return; } else { Ajax.call('user.php?act=signin', 'username=' + username + '&password=' + encodeURIComponent(password) + '&captcha=' + captcha, signinResponse, "POST", "TEXT"); } } else { alert('Template error!'); } } function signinResponse(result) { var userName = document.forms['ECS_LOGINFORM'].elements['username'].value; var mzone = document.getElementById("ECS_MEMBERZONE"); var res = result.parseJSON(); if (res.error > 0) { alert(res.content); if(res.html) { mzone.innerHTML = res.html; document.forms['ECS_LOGINFORM'].elements['username'].value = userName; } } else { if (mzone) { mzone.innerHTML = res.content; evalscript(res.ucdata); //alert(res.ucdata); } else { window.location.reload() } } } </script> {/literal} 还需要注意的一点是,如果您的模板已经解决过jquery冲突,引用了jquery.json.js, 那其中 var res = result.parseJSON(); 要改成 var res = $.evalJSON(result);
如果文章对您有帮助,就打赏一个吧