JQuery记住用户名和密码的具体实现


Posted in Javascript onApril 04, 2014
<div> 
<input id="username" type="text" class="txt1" value="请输入用户名" onclick="if(this.value=='请输入用户名'){this.value=''; }" onfocus="if(this.value=='请输入用户名'){this.value=''; }" /> 
<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';}"/> 
</div>

JQuery Code
$(document).ready(function(){ 
if ($.cookie("rmbUser") == "true") { 
$("#ck_rmbUser").prop("checked", true); 
$("#username").val($.cookie("username")); 
$("#password").remove(); 
$("#pass").append("<input id='password' type='password' class='txt2'/>"); 
$("#password").val($.cookie("password")); 
} 
$("#loginButton").click(function(){ 
if(check()){ 
login(); 
} 
}); 
}); 
//记住用户名密码 
function save() { 
if ($("#ck_rmbUser").prop("checked")) { 
var username = $("#username").val(); 
var password = $("#password").val(); 
$.cookie("rmbUser", "true", { expires: 7 }); //存储一个带7天期限的cookie 
$.cookie("username", username, { expires: 7 }); 
$.cookie("password", password, { expires: 7 }); 
}else{ 
$.cookie("rmbUser", "false", { expire: -1 }); 
$.cookie("username", "", { expires: -1 }); 
$.cookie("password", "", { expires: -1 }); 
} 
}; 
function check(){ 
var username = $("#username").val(); 
var password = $("#password").val(); 
if(username == "" || username == "请输入用户名"){ 
$("#tip").text("请输入用户名!"); 
$("#username").focus(); 
return false; 
} 
if(password == "" || password == "请输入密码"){ 
$("#tip").text("请输入密码!"); 
$("#password").focus(); 
return false; 
} 
$("#tip").text(""); 
return true; 
} 
function login(){ 
$.ajax({ 
type:"POST", 
url: "login!loginValidate.action", 
data:{userName:$("#username").val(),password:$("#password").val()}, 
dataType:"json", 
beforeSend: function(){ 
showOverlay(); 
}, 
success:function(data){ 
if(data.success){ 
addCookie("userName", $("#username").val(), 0); 
save(); 
location.href = "/index.jsp"; 
}else{ 
$("#overlay").hide(); 
$("#tip").text("用户名或密码错误,请重新登录!"); 
return false; 
} 
} 
}); 
}
Javascript 相关文章推荐
浅谈JavaScript中面向对象技术的模拟
Sep 25 Javascript
jquery对象和DOM对象的区别介绍
Aug 09 Javascript
深入理解JavaScript系列(35):设计模式之迭代器模式详解
Mar 03 Javascript
BootStrap 图标icon符号图标glyphicons不正常显示的快速解决办法
Dec 08 Javascript
jQuery.Validate表单验证插件的使用示例详解
Jan 04 Javascript
bootstrap Table插件使用demo
Aug 07 Javascript
Vue.js在数组中插入重复数据的实现代码
Nov 17 Javascript
微信小程序实现YDUI的ScrollNav组件
Feb 02 Javascript
JS实现中英文混合文字溢出友好截取功能
Aug 06 Javascript
jQuery实现图片简单轮播功能示例
Aug 13 jQuery
node.js命令行教程图文详解
May 27 Javascript
Vue实现点击导航栏当前标签后变色功能
Aug 19 Javascript
JS根据变量保存方法名并执行方法示例
Apr 04 #Javascript
JavaScript制作的可折叠弹出式菜单示例
Apr 04 #Javascript
JavaScript排序算法之希尔排序的2个实例
Apr 04 #Javascript
JavaScript中的prototype.bind()方法介绍
Apr 04 #Javascript
jQuery使用ajaxSubmit()提交表单示例
Apr 04 #Javascript
深入理解javascript的执行顺序
Apr 04 #Javascript
iframe窗口高度自适应的又一个巧妙实现思路
Apr 04 #Javascript
You might like
rephactor 优秀的PHP的重构工具
2011/06/09 PHP
一个简单且很好用的php分页类
2013/10/26 PHP
php遍历解析xml字符串的方法
2016/05/05 PHP
php使用CURL模拟GET与POST向微信接口提交及获取数据的方法
2016/09/23 PHP
Laravel学习教程之View模块详解
2017/09/18 PHP
JavaScript 学习点滴记录
2009/04/24 Javascript
Jquery iframe内部出滚动条
2010/02/11 Javascript
JS中Date日期函数中的参数使用介绍
2014/01/02 Javascript
JS数组(Array)处理函数整理
2014/12/07 Javascript
Boostrap基础教程之JavaScript插件篇
2016/09/08 Javascript
javascript 定时器工作原理分析
2016/12/03 Javascript
react-native 完整实现登录功能的示例代码
2017/09/11 Javascript
详解Node使用Puppeteer完成一次复杂的爬虫
2018/04/18 Javascript
Django+Vue跨域环境配置详解
2018/07/06 Javascript
微信小程序之判断页面滚动方向的示例代码
2018/08/30 Javascript
Vue 监听列表item渲染事件方法
2018/09/06 Javascript
python使用正则搜索字符串或文件中的浮点数代码实例
2014/07/11 Python
仅用50行Python代码实现一个简单的代理服务器
2015/04/08 Python
Android分包MultiDex策略详解
2017/10/30 Python
python 多线程串行和并行的实例
2019/02/22 Python
Python redis操作实例分析【连接、管道、发布和订阅等】
2019/05/16 Python
Python利用pandas处理Excel数据的应用详解
2019/06/18 Python
django框架自定义模板标签(template tag)操作示例
2019/06/24 Python
python 计算平均平方误差(MSE)的实例
2019/06/29 Python
Python requests模块基础使用方法实例及高级应用(自动登陆,抓取网页源码)实例详解
2020/02/14 Python
Python+appium框架原生代码实现App自动化测试详解
2020/03/06 Python
Python 将代码转换为可执行文件脱离python环境运行(步骤详解)
2021/01/25 Python
Data URI scheme详解和使用实例及图片base64编码实现方法
2014/05/08 HTML / CSS
国际知名设计师时装商店:Coggles
2016/09/05 全球购物
美国最大的骑马用品零售商:HorseLoverZ
2017/01/12 全球购物
人力资源作业细则
2014/03/03 职场文书
师范生自我鉴定
2014/03/20 职场文书
道德之星事迹材料
2014/05/03 职场文书
七夕相亲活动策划方案
2014/08/31 职场文书
浅析MongoDB之安全认证
2021/06/26 MongoDB
MySQL Server 层四个日志
2022/03/31 MySQL