HTML Code
1 <div> 2 <input id="username" type="text" class="txt1" value="请输入用户名" onclick="if(this.value==‘请输入用户名‘){this.value=‘‘; }" onfocus="if(this.value==‘请输入用户名‘){this.value=‘‘; }" /> 3 <input id="password" type="text" class="txt2" value="请输入密码" onclick="if(this.value==‘请输入密码‘){this.value=‘‘;this.type=‘password‘;}" onfocus="if(this.value==‘请输入密码‘){this.value=‘‘;this.type=‘password‘;}"/> 4 </div>
JS Code
1 $(document).ready(function(){ 2 if ($.cookie("rmbUser") == "true") { 3 $("#ck_rmbUser").prop("checked", true); 4 $("#username").val($.cookie("username")); 5 $("#password").remove(); 6 $("#pass").append("<input id=‘password‘ type=‘password‘ class=‘txt2‘/>"); 7 $("#password").val($.cookie("password")); 8 } 9 $("#loginButton").click(function(){ 10 if(check()){ 11 login(); 12 } 13 }); 14 }); 15 16 17 //记住用户名密码 18 function save() { 19 if ($("#ck_rmbUser").prop("checked")) { 20 var username = $("#username").val(); 21 var password = $("#password").val(); 22 $.cookie("rmbUser", "true", { expires: 7 }); //存储一个带7天期限的cookie 23 $.cookie("username", username, { expires: 7 }); 24 $.cookie("password", password, { expires: 7 }); 25 }else{ 26 $.cookie("rmbUser", "false", { expire: -1 }); 27 $.cookie("username", "", { expires: -1 }); 28 $.cookie("password", "", { expires: -1 }); 29 } 30 }; 31 32 33 function check(){ 34 var username = $("#username").val(); 35 var password = $("#password").val(); 36 if(username == "" || username == "请输入用户名"){ 37 $("#tip").text("请输入用户名!"); 38 $("#username").focus(); 39 return false; 40 } 41 if(password == "" || password == "请输入密码"){ 42 $("#tip").text("请输入密码!"); 43 $("#password").focus(); 44 return false; 45 } 46 $("#tip").text(""); 47 return true; 48 } 49 50 function login(){ 51 $.ajax({ 52 type:"POST", 53 url: "login!loginValidate.action", 54 data:{userName:$("#username").val(),password:$("#password").val()}, 55 dataType:"json", 56 beforeSend: function(){ 57 showOverlay(); 58 }, 59 success:function(data){ 60 if(data.success){ 61 addCookie("userName", $("#username").val(), 0); 62 save(); 63 location.href = "/index.jsp"; 64 }else{ 65 $("#overlay").hide(); 66 $("#tip").text("用户名或密码错误,请重新登录!"); 67 return false; 68 } 69 70 } 71 }); 72 }