你的位置:首页 > 软件开发 > Java > jquery完成界面无刷新加载登陆注册

jquery完成界面无刷新加载登陆注册

发布时间:2016-07-30 12:00:05
昨天公司说官网的登陆注册每次要跳转到另一个界面,能不能做一个简单的,在界面弹出一个框框登陆,我想了想做了这么一个案例,大家来看看成不成贴上代码,实现了在同一个弹出窗上加载了登陆注册功能!可自由点击!当然样式丑了一些!还请见谅!demo在下面1这里是html内容 1 <!DO ...

jquery完成界面无刷新加载登陆注册

昨天公司说官网的登陆注册每次要跳转到另一个界面,能不能做一个简单的,在界面弹出一个框框登陆,我想了想做了这么一个案例,大家来看看成不成

贴上代码,实现了在同一个弹出窗上加载了登陆注册功能!可自由点击!当然样式丑了一些!还请见谅!demo在下面

1这里是html内容

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html ="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>jQuery鼠标点击弹出登录框代码</title> 6 </head> 7 <body> 8 <br><br><br><br><br><br><br> 9 <div class="login-header"><a href="javascript:void(0);">点击,弹出登录框</a></div>10   <div class="login-header1"><a href="javascript:void(0);">点击,弹出登录框</a></div>11 12   <div id="js_login" class="js_login">13     <div class="js_title">14       <ul>15         <li class="conxk1" id="_xka1" onclick="switchTag('_xka','_xka_list',1,2,'conxk1','conxk2');">16           用户登录17         </li>18         <li class="conxk2" id="_xka2" onclick="switchTag('_xka','_xka_list',2,2,'conxk1','conxk2');">19           快速注册20         </li>21       </ul>      <span class="close-login">×</span>22     </div>23     <div class="js_content">24       <div class="con_dak fixed clear">25         <div id="_xka_list1" class="showbox">26           <div class="de_list">27             <!----------login start------>28             <div id="login">29               <div class="inputbg" id="logtext">30                 <input name="logusername" id="logusername" type="text" value="输入用户名" placeholder="输入用户名" class="inputsub" />31               </div>32               <div class="inputbg" id="pass">33                 <input name="logpassword" placeholder="输入密码" type="password" value="" id="logpassword" class="inputsub" />34               </div>35               <div class="buttons">36                 <input type="button" class="sub_btn1" id="login-submokaoba" onclick="ajaxlogin()" value="登  录" />37               </div>38               <div class="clr"></div>39               <div class="reg">40                 忘记密码?<a href="http://www.mokaoba.com/">找回密码</a> <span id="errmsg"></span>41               </div>42             </div>43             <!--------login end--------->44           </div>45         </div>46 47 48         <div id="_xka_list2" class="hidden">49           <div class="de_list">50             <!--------register start--------->51             <form method="post" enctype="multipart/form-data" name="userinfoform" id="userinfoform">52               <input type="hidden" name="enews" value="register" />53               <input name="groupid" type="hidden" id="groupid" value="1" />54               <div id="register">55                 <ul class="Reg-input">56                   <li class="Reg-text">用户名:</li>57                   <li><input name="UserName" id="UserName" type="text" class="input-text" required="" /> <span class="UserName"></span></li>58                 </ul>59                 <ul class="Reg-input">60                   <li class="Reg-text">密码:</li>61                   <li><input name="Password" onblur="CheckReg('Password', this.value)" type="password" id="Password" class="input-text" required="" /> <span class="Password"></span></li>62                 </ul>63                 <ul class="Reg-input">64                   <li class="Reg-text">重复密码:</li>65                   <li><input name="repassword" onblur="CheckReg('repassword',this.value)" type="password" id="repassword" class="input-text" required="" /> <span class="repassword"></span></li>66                 </ul>67                 <ul class="Reg-input">68                   <li class="Reg-text">真实姓名:</li>69                   <li><input name="RealName" onblur="CheckReg('RealName', this.value)" type="text" id="RealName" class="input-text" required="" /> <span class="RealName"></span></li>70                 </ul>71                 <ul class="Reg-input">72                   <li class="Reg-text">手机号码:</li>73                   <li><input name="Telephone" onblur="CheckReg('Telephone', this.value)" type="text" id="Telephone" class="input-text" required="" /> <span class="Telephone"></span></li>74                 </ul>75                 <ul class="Reg-input">76                   <li class="Reg-text">E-mail:</li>77                   <li><input name="Mail" onblur="CheckReg('Mail', this.value)" type="text" id="Mail" class="input-text" required="" /> <span class="Mail"></span></li>78                 </ul>79                 <ul class="Reg-input">80                   <li class="Reg-text">&nbsp;</li>81                   <li id="checkbox"><input type="checkbox" id="checkin" onclick="checkpass('all')" /> 我已阅读并接受《<a href="http://www.cnblogs.com//http://www.jiao4.com/javascript" target="_blank">服务条款</a>》</li>82                 </ul>83                 <div style="clear:both"></div>84                 <div class="buttons">85                   <input type="button" class="sub_btn1" id="Reg-submokaoba" onclick="ajaxzhuce()" name="zhuce" value="注  册" />&nbsp;&nbsp;<span id="checkreg"></span>86                 </div>87                 <div class="clr"></div>88               </div>89             </form>90             <!--------register end--------->91           </div>92         </div>93       </div>94     </div>95   </div>96   <div class="login-bg"></div>97 </body>98 </html>

原标题:jquery完成界面无刷新加载登陆注册

关键词:jquery

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录