03.PasswordConfirm.htm |
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<title>암호확인 기능 구현하기</title>
<script src="../jQuery/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{ //[1]
lblError 레이어 클리어 $('#txtPassword').keyup(function() { //$('#lblError').remove();
// 제거 $('#lblError').text(''); // 제거가 아니라 클리어 }); //[2] 암호 확인 기능 구현 $('#txtPasswordConfirm').keyup(function() { if
($('#txtPassword').val()
!= $('#txtPasswordConfirm').val())
{ $('#lblError').text('');
// 클리어 $('#lblError').html("<b>암호가 틀립니다.</b>");
//레이어에 HTML 출력 } else
{ $('#lblError').text('');
// 클리어 $('#lblError').html("<b>암호가 맞습니다.</b>"); } });
});
</script> </head> <body>
<table style="border: 1px solid skyblue;">
<tr> <td>암호 : </td> <td><input type="password" id="txtPassword" size="20" /></td>
</tr>
<tr> <td>암호확인 :</td> <td><input type="password" id="txtPasswordConfirm" size="20" /></td>
</tr>
</table>
<div id="lblError">암호를 입력하시오.</div>
</body> </html> |
결과화면 |
[그림25-1] |
'jQuery | javascript | CSS' 카테고리의 다른 글
-- 현재 까지의 jQuery 소스2 -- (0) | 2009.11.09 |
---|---|
26.jQuery - 선택값 가져오기 ( 02.Selectors - 04.Selected ) (0) | 2009.11.09 |
24.jQuery - 속성값 복사 ( 02.Selectors - 02.Text ) (0) | 2009.11.09 |
23.jQuery - Input ( 02.Selectors - 01.Input ) (0) | 2009.11.09 |
22.jQuery - For문 ( 01.Core- 02.Indexer ) (2) | 2009.11.09 |
Comments