사용자 로그인을 구현하고 비밀번호를 저장하는 jquery.cookie.js 메소드

이 기사의 예에서는 jquery.cookie.js가 사용자 로그인을 위한 비밀번호 저장 기능을 구현하는 방법을 설명합니다. 참고하실 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.

가져와야 하는 js는 jquery.js와 jquery.cookie.js입니다

<script type="text/javascript" src=" jquery-1.5.2.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script>

페이지가 로드되면 먼저 쿠키의 값을 가져옵니다. 쿠키에 값이 있으면 얻은 값을 입력 상자에 입력하고 확인란을 선택하여 비밀번호를 저장합니다

jQuery(function(){
 //获取cookie的值
 var username = $.cookie('username');
 var password = $.cookie('password');
 //将获取的值填充入输入框中
 $('#uName').val(username);
 $('#psw').val(password); 
 if(username != null && username != '' && password != null && password != ''){//选中保存秘密的复选框
  $("#remember_password").attr('checked',true);
 }
});

로그인 시 비밀번호 저장 체크박스가 선택되어 있는지 확인하세요. 선택되어 있으면 쿠키를 생성하세요. (유효기간은 사용자가 정할 수 있습니다. 아래 쿠키는 7일 동안 유효합니다. 선택되어 있지 않으면 삭제하세요.) (지난번에 저장되었을 수 있으므로) 비밀번호, 이번 로그인에 대한 비밀번호 저장을 취소하도록 선택하면 다음 로그인 시 쿠키가 더 이상 유효하지 않도록 쿠키를 삭제해야 합니다.
쿠키 삭제 작업에 특히 주의하세요. 인터넷의 많은 기사에서는 $.cookie('username',null) 방법을 사용하지만 이 방법을 사용하면 다시 로그인할 때마다 쿠키가 존재합니다. $.cookie('username','')를 사용하려고 하는데 여전히 문제가 있어서 프로그램이 비밀번호를 저장할 수 없게 됩니다.

//提交表单的处理函数
function Login()
{
 var uName =$('#uName').val();
 var psw = $('#psw').val();
 if($('#remember_password').attr('checked') == true){//保存密码
  $.cookie('username',uName, {expires:7,path:'/'});
  $.cookie('password',psw, {expires:7,path:'/'});
 }else{//删除cookie
  $.cookie('username', '', { expires: -1, path: '/' });
  $.cookie('password', '', { expires: -1, path: '/' });
 }
 //....
 //提交表单的操作
}

로그인 페이지의 비밀번호 저장 체크박스

<input type="checkbox" name="remember_password" id="remember_password"/>
<span id="span_tip" style="margin-bottom:-2px;color:white;font-size:12px;">记住密码
</span>

PS: 여기서 매우 강력하고 사용하기 쉬운 JavaScript 압축, 서식 지정 및 암호화 도구를 권장합니다(코드를 암호화하려는 경우 시도해 보고 싶을 수도 있습니다. 여기에서 js 암호화 기능을 사용해 보세요.

JavaScript 압축/포맷/암호화 도구: http://tools.jb51.net/code/jscompress

또한 위 js 도구의 암호화는 평가 함수 암호화 형식을 사용합니다. 이를 위해 이 사이트에서는 매우 강력하고 실용적인 평가 함수 암호화를 위한 다음과 같은 암호 해독 도구도 제공합니다!

JS 평가 방법 온라인 암호화 및 복호화 도구: http://tools.jb51.net/password/evalencode

더 많은 jQuery 관련 콘텐츠에 관심이 있는 독자들은 이 사이트에서 특별한 주제를 확인할 수 있습니다: "JQuery 쿠키 조작 기술 요약", "jQuery 테이블(테이블) 조작 기술 요약" , "jQuery 드래그 효과 및 기법 요약", "jQuery 확장 기법 요약", "jQuery 공통 클래식 특수 효과 요약", "jQuery 애니메이션 및 특수 효과 사용 요약", "jquery 선택기 사용 요약" 및 "jQuery 일반 플러그인 및 사용 요약"

이 기사가 jQuery 프로그래밍에 종사하는 모든 사람에게 도움이 되기를 바랍니다.