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 相关文章推荐
jquery模拟按下回车实现代码
Sep 20 Javascript
javascript将数字转换整数金额大写的方法
Jan 27 Javascript
js实现鼠标点击文本框自动选中内容的方法
Aug 20 Javascript
js阻止浏览器默认行为触发的通用方法(推荐)
May 15 Javascript
jQuery图片轮播功能实例代码
Jan 29 Javascript
动态创建Angular组件实现popup弹窗功能
Sep 15 Javascript
jQuery 实现左右两侧菜单添加、移除功能
Jan 02 jQuery
解决vue 中 echart 在子组件中只显示一次的问题
Aug 07 Javascript
详解JS取出两个数组中的不同或相同元素
Mar 20 Javascript
微信小程序实现跳转的几种方式总结(推荐)
Apr 24 Javascript
node学习笔记之读写文件与开启第一个web服务器操作示例
May 29 Javascript
eslint+prettier统一代码风格的实现方法
Jul 22 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
php 多个submit提交表单 处理方法
2009/07/07 PHP
组合算法的PHP解答方法
2012/02/04 PHP
新浪刚打开页面出来的全屏广告代码
2007/04/02 Javascript
JavaScript动态改变HTML页面元素例如添加或删除
2014/08/10 Javascript
详解JavaScript的另类写法
2016/04/11 Javascript
AngularJS解决ng界面长表达式(ui-set)的方法分析
2016/11/07 Javascript
AngularJS模仿Form表单提交的实现代码
2016/12/08 Javascript
javascript简单写的判断电话号码实例
2017/05/24 Javascript
详解Vue.js Mixins 混入使用
2017/09/15 Javascript
element ui里dialog关闭后清除验证条件方法
2018/02/26 Javascript
vue二级菜单导航点击选中事件的方法
2018/09/12 Javascript
jQuery点击页面其他部分隐藏下拉菜单功能
2018/11/27 jQuery
JS判断两个数组或对象是否相同的方法示例
2019/02/28 Javascript
使用ESLint禁止项目导入特定模块的方法步骤
2019/03/04 Javascript
JS事件流与事件处理程序实例分析
2019/08/16 Javascript
使用xampp将angular项目运行在web服务器的教程
2019/09/16 Javascript
vuejs+element UI table表格中实现禁用部分复选框的方法
2019/09/20 Javascript
VUE:vuex 用户登录信息的数据写入与获取方式
2019/11/11 Javascript
Ant design vue中的联动选择取消操作
2020/10/31 Javascript
vue开发chrome插件,实现获取界面数据和保存到数据库功能
2020/12/01 Vue.js
python基础教程之获取本机ip数据包示例
2014/02/10 Python
python虚拟环境virtualenv的安装与使用
2017/09/21 Python
Python3 实现随机生成一组不重复数并按行写入文件
2018/04/09 Python
Python读写文件模式和文件对象方法实例详解
2019/09/17 Python
利用Python自动化操作AutoCAD的实现
2020/04/01 Python
python argparse模块通过后台传递参数实例
2020/04/20 Python
python不到50行代码完成了多张excel合并的实现示例
2020/05/28 Python
策划主管的工作职责
2013/11/24 职场文书
弘扬雷锋精神演讲稿
2014/05/10 职场文书
日语专业毕业生自荐书
2014/06/18 职场文书
开发房地产协议书
2014/09/14 职场文书
不听老师话的万能检讨书
2014/10/04 职场文书
大学生安全教育主题班会
2015/08/12 职场文书
初中数学教学反思范文
2016/02/17 职场文书
MySQL的全局锁和表级锁的具体使用
2021/08/23 MySQL
MySQL范围查询优化的场景实例详解
2022/06/10 MySQL