`
zb5594921
  • 浏览: 19122 次
社区版块
存档分类
最新评论

Jquery 登陆页面 Cookie记住用户名密码

 
阅读更多

记住用户名密码:

步骤

1.需要的Cookie.js 直接Copy用就行了 ,不需要做任何修改!

//hours为空字符串时,cookie的生存期至浏览器会话结束。hours为数字0时,建立的是一个失效的cookie,这个cookie会覆盖已经建立过的同名、同path的cookie(如果这个cookie存在)。   
function setCookie(name,value,hours,path){   
    var name = escape(name);   
    var value = escape(value);   
    var expires = new Date();   
    expires.setTime(expires.getTime() + hours*3600000);   
    path = path == "" ? "" : ";path=" + path;   
    _expires = (typeof hours) == "string" ? "" : ";expires=" + expires.toUTCString();   
    document.cookie = name + "=" + value + _expires + path;   
}   
//获取cookie值    方法
function getCookieValue(name){   
    var name = escape(name);   
    //读cookie属性,这将返回文档的所有cookie   
    var allcookies = document.cookie;          
    //查找名为name的cookie的开始位置   
    name += "=";   
    var pos = allcookies.indexOf(name);       
    //如果找到了具有该名字的cookie,那么提取并使用它的值   
    if (pos != -1){                                             //如果pos值为-1则说明搜索"version="失败   
        var start = pos + name.length;                  //cookie值开始的位置   
        var end = allcookies.indexOf(";",start);        //从cookie值开始的位置起搜索第一个";"的位置,即cookie值结尾的位置   
        if (end == -1) end = allcookies.length;        //如果end值为-1说明cookie列表里只有一个cookie   
        var value = allcookies.substring(start,end);  //提取cookie的值   
        return unescape(value);                           //对它解码         
        }      
    else return "";                                             //搜索失败,返回空字符串   
}   

2.还需要一个jquery-1.6.1.min.js ,这个大家应该都有 ,就不传了。

3.首页
<input type="text" style="width:287px; border:0;"  id="j_username" name="j_username" value="">

<input type="password"  style="width:287px; border:0;" id="j_password" name="j_password" value="" />

<input type="checkbox" id="rememberPW" name="rememberPW"/>记住密码
 
4.JS代码 ,来操作存/读Cookie

//登录事件
	function doLogin() {
		var userName = document.getElementById("username");
		var pwd = document.getElementById("password");
		if(userName.value.replace(/ /g,"")==""){
				alert("用户名不能为空!");
				userName.focus();
				return false;
			}
		if(pwd.value==""){
				alert("密码不能为空!");
				pwd.focus();
				return false;
			}
		setCookie('cookUser', userName.value, time, '/');//set 获取用户名和密码 传给cookie
		setCookie('cookPass', pwd.value, time, '/');
		document.login_form.submit();
			
		}
		//设置Cookie保存时间
		var time = 0;
		
		$(document).ready(function(){
		//获取Cookie保存的用户名和密码
		var username = getCookieValue("cookUser");
		var password = getCookieValue("cookPass");
		
		if (username !='' && password !='' ) {
			$("#username").val(username);
			$("#password").val(password);
			$("#rememberPW").attr("checked", true);
		}else 
			$("#rememberPW").attr("checked", false);
		
		$("#rememberPW").click(function(){//记住密码
			if($(this).attr("checked") == 'checked'){
			time = 60 * 60 * 60;
			}
			});
		});
网上例子很多,但太杂,给个能用的。希望能帮到大家
0
6
分享到:
评论

相关推荐

    登录页面记住用户名密码

    "登录页面记住用户名密码"这一功能是提高用户体验的一个常见特性,它允许用户在首次登录后选择保存他们的用户名和密码,以便下次访问时能够快速便捷地登录,通常会配合一个复选框供用户选择是否开启此功能。...

    一个记住用户名密码demo

    在IT开发领域,尤其是Web应用开发中,"记住用户名密码"功能是一个常见的用户需求,它提高了用户体验,使得用户在多次登录同一网站时不必反复输入账号信息。本项目名为"一个记住用户名密码demo",旨在提供一个实现这...

    Javascript实现登录记住用户名和密码功能

    Javascript实现登录记住用户名和密码功能的核心在于使用Web存储技术,这里主要用到了cookies技术来实现这一需求。在页面加载时,可以通过读取保存在本地的cookies来自动填充表单中的用户名和密码信息,从而达到记住...

    使用jquery的cookie实现登录页记住用户名和密码的方法

    在本文中,我们将探讨如何使用jQuery的Cookie插件来实现在登录页面上记住用户名和密码的功能。这个功能对于提高用户体验至关重要,因为它允许用户在下次访问时不必重新输入他们的凭据。我们将详细介绍实现这一功能所...

    JQuery记住用户名密码实现下次自动登录功能

    ### JQuery记住用户名密码实现下次自动登录功能知识点解析 #### 知识点一:JQuery及Cookie简介 **JQuery** 是一个快速、小巧、功能丰富的JavaScript库。它使用户能够通过编写更少的代码来操作文档、处理事件、实现...

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

    9. 安全性:虽然使用Cookie记住用户名和密码可以提升用户体验,但也存在着安全隐患。开发者需要确保敏感信息加密传输,并且合理设置Cookie的过期时间,同时避免跨站脚本攻击(XSS)和跨站请求伪造(CSRF)等安全风险。 ...

    通过cookie记住密码-HTML样例源码

    在登录场景中,如果用户选择了“记住密码”,我们可以设置一个Cookie来存储他们的用户名和加密后的密码。 在HTML中,我们通常会使用JavaScript(或jQuery等库)来处理表单事件。例如,我们可以监听表单的提交事件,...

    jquery.cookie.js 操作cookie实现记住密码功能的实现代码

    本文将详细介绍如何使用`jquery.cookie.js`实现记住密码功能,并讲解其核心概念和用法。 首先,Cookie是一种存储在用户浏览器中的小型文本文件,用于在用户与网站交互时保存数据。它允许网站在用户下次访问时识别...

    jquery cookie.js

    jQuery Cookie.js 提供了一个很好的例子,展示了如何实现记住用户名和密码的功能。假设我们有登录表单的输入字段,如下: ```html &lt;button type="submit"&gt;Login ``` 我们可以监听表单提交事件,并在用户...

    jquery.cookie.zip

    5. **记住密码**:对于用户希望快速登录的网站,可以使用Cookie记住用户名或密码。 **四、兼容性与注意事项** jQuery Cookie插件兼容大多数现代浏览器,包括IE6+、Firefox、Chrome、Safari和Opera。然而,由于安全...

    jquery精美登陆界面

    1. HTML结构:一个基本的登录界面通常包括用户名输入框、密码输入框、登录按钮以及可能的记住我选项。确保使用`&lt;form&gt;`标签包裹这些元素,以便于管理和提交数据。 2. CSS美化:利用CSS对登录界面进行样式设计,包括...

    Jquery操作Cookie|多个输入框同时输入效果|下拉列表经典例子

    假设页面上有两个输入框,分别用于输入用户名和密码,并且需要实时显示输入状态: ```html 用户名"&gt; 密码"&gt; &lt;p id="status"&gt;&lt;/p&gt; ``` ```javascript $('#username, #password').on('input', function() { var ...

    node.js平台下利用cookie实现记住密码登陆(Express+Ejs+Mysql)

    在实现记住密码功能时,用户在登录页面选择“记住密码”选项后,系统需要在用户浏览器中保存一个Cookie,里面记录用户的登录信息。通常会把用户的用户名和一个加密的密码(有时还会加上时间戳等信息)存储在Cookie中...

    jquery.cookie.js实现用户登录保存密码功能的方法

    这段代码会检查是否有已存在的Cookie,如果有的话,就将用户名和密码填充到相应的输入框中,并选中“记住密码”复选框。例如: ```javascript jQuery(function(){ var username = $.cookie('username'); var ...

    登陆注册页面模板.zip

    4. **记住我功能**:通过JS,可以实现“记住我”选项,将用户的登录状态保存在本地存储或cookie中,方便下次直接访问。 5. **登录注册切换**:页面可能有一个切换按钮,让用户在登录和注册间自由选择,JS可以轻松...

    Jquery实现用户注册和登入(Asp.Net版)

    - **记住我**:添加"记住我"选项,通过设置cookie,使用户在下次访问时自动登录。 - **Ajax验证**:同样,登录时使用Ajax提交用户凭证,服务器端验证后返回结果,展示登录成功或失败状态。 在Asp.Net框架下,我们...

    jQuery实现的各大网站常用的弹出登录框

    此外,还可以设置记住密码功能,通过`$.cookie()`来存储和读取用户的选择。 在提交登录信息时,通常会向服务器发送AJAX请求。jQuery的`$.ajax()`函数为此提供了便利。你可以设置`type`为'POST',`url`为登录接口...

Global site tag (gtag.js) - Google Analytics