String.prototype.atrim = function()
{
return this.replace(/\s/g,'');
}
모든 공백을 제거한 후 값을 반환한다.
사용 예 : document.getElementById("id").value = document.getElementById("id").value.atrim();
<input type="text" onblur="this.value=this.value.atrim()" />
<!DOCTYPE HTML>
<html>
<head>
<title>javascript 숫자 형식만 입력받기</title>
<style>
input {height:12px;}
p {display:inline;}
.nb {ime-mode: disabled;width:30px;}
</style>
<script type="text/javascript">
// 숫자 확인
String.prototype.only_number = function(){
return this.replace(/[^0-9]/gi, '');
}
</script>
</head>
<body>
<p>숫자 : </p>
<input type="text" id="n" maxlength="4" class="nb" value="" onblur="this.value=this.value.only_number();" />
</body>
</html>
javascript 정규식을 이용해서 영문, 숫자 혼용만 사용하는 비밀번호 확인
//=== 영문, 숫자 혼용 확인
// 혼용이면 true, 아니면 false
function rtn_engnum_mix_chk(str)
{
var chk_num = str.search(/[0-9]/g);
var chk_eng = str.search(/[a-z]/ig);
if(chk_num < 0 || chk_eng < 0)
{
return false;
}
return true;
}
//=== 영문, 숫자 확인
// 영문 또는 숫자이면 true, 아니면 false
function rtn_engnum_chk(str)
{
for( var i = 0; i <= str.length -1 ; i++ )
{
if('a' <= str.charAt(i) && str.charAt(i) <= 'z' || str.charAt(i) >= '0' && str.charAt(i) <= '9'){}
else
{
return false;
}
}
return true;
}
// 확인 : 비밀번호
function passwd_chk(passwd1, passwd2)
{
passwd1 = passwd1.trim().toLowerCase(); // javascript를 이용해서 trim() 구현하기 바로가기
passwd2 = passwd2.trim().toLowerCase();
var str = passwd1;
if(passwd1.length < 6 || passwd1.length > 12)
{
alert ("비밀번호는 6~12자의 영문 및 숫자혼용만 사용할 수 있습니다.");
return false;
}
else if(passwd1 != passwd2)
{
alert ("비밀번호와 비밀번호 확인이 일치하지 않습니다.");
return false;
}
if(!rtn_engnum_mix_chk(str))
{
alert("비밀번호는 숫자와 영문자를 혼용해야 합니다.");
return false;
}
if(!rtn_engnum_chk(str))
{
alert ("비밀번호는 영문 및 숫자로 구성되어야 합니다");
return false;
}
return true;
}
// 비밀번호변경
function modify_pw_chk(f)
{
f.passwd.value = f.passwd.value.trim();
f.passwd1.value = f.passwd1.value.trim();
f.passwd2.value = f.passwd2.value.trim();
if(f.passwd.value == '')
{
alert("현재 비밀번호를 입력해주세요");
f.passwd.focus();
return false;
}
if(f.passwd.value.length < 6 || f.passwd.value.length > 12)
{
alert ("비밀번호는 6~12자의 영문 및 숫자혼용만 사용할 수 있습니다.");
f.passwd.focus();
return false;
}
if(!rtn_engnum_mix_chk(f.passwd.value))
{
alert("비밀번호는 숫자와 영문자를 혼용해야 합니다.");
f.passwd.focus();
return false;
}
if(!rtn_engnum_chk(f.passwd.value))
{
alert ("비밀번호는 영문 및 숫자로 구성되어야 합니다");
f.passwd.focus();
return false;
}
if(f.passwd1.value == '')
{
alert("새로운 비밀번호를 입력해주세요");
f.passwd1.focus();
return false;
}
else if(f.passwd2.value == '')
{
alert("새로운 비밀번호를 한번 더 입력해주세요");
f.passwd2.focus();
return false;
}
else if(f.passwd1.value != '' && !passwd_chk(f.passwd1.value, f.passwd2.value))
{
return false;
}
f.submit();
}
사용예>
<form name="f" method="post">
<input type="password" id="passwd" name="passwd" maxlength="12" style="ime-mode:disabled;" title="6~12자의 영문 및 숫자혼용" />
<input type="password" id="passwd2" name="passwd2" maxlength="12" style="ime-mode:disabled;" title="6~12자의 영문 및 숫자혼용" />
<input type="password" id="passwd3" name="passwd3" maxlength="12" style="ime-mode:disabled;" title="6~12자의 영문 및 숫자혼용" />
<a href="javascript:;" onclick="modify_pw_chk(document.f)">비밀번호변경</a>
</form>
자바스크립트(javascript)를 이용해서 영문, 숫자(또는 혼용)를 확인
//=== 영문, 숫자 혼용 확인
// 혼용이면 true, 아니면 false
function rtn_engnum_mix_chk(str)
{
var chk_num = str.search(/[0-9]/g);
var chk_eng = str.search(/[a-z]/ig);
if(chk_num < 0 || chk_eng < 0)
{
return false;
}
return true;
}
//=== 영문, 숫자 확인
// 영문 또는 숫자이면 true, 아니면 false
function rtn_engnum_chk(str)
{
for( var i = 0; i <= str.length -1 ; i++ )
{
if('a' <= str.charAt(i) && str.charAt(i) <= 'z' || str.charAt(i) >= '0' && str.charAt(i) <= '9'){}
else
{
return false;
}
}
return true;
}
사용 예>
if(!rtn_engnum_mix_chk(str))
{
alert("숫자와 영문자를 혼용해야 합니다.");
return false;
}
if(!rtn_engnum_chk(str))
{
alert ("영문 또는 숫자로 구성되어야 합니다");
return false;
}
별명(닉네임) 입력 글자를 확인하는 자바스크립트 정규식으로
한글, 영문, 숫자만 입력할 수 있다.
function nick_chk(str)
{
if(str.length < 2 || str.length > 10) {
alert("2~10자의 한글, 영문, 숫자만 사용할 수 있습니다.");
return false;
}
var chk = /[0-9]|[a-z]|[A-Z]|[가-힣]/;
for( var i = 0; i <= str.length -1 ; i++ )
{
if(chk.test(str.charAt(i)))
{
}
else
{
alert("2~10자의 한글, 영문, 숫자만 사용할 수 있습니다.");
return false;
}
}
return true;
}
<input type="text" id="nick" name="nick" maxlength="10" onblur="nick_chk(this.value);" />
자바스크립트 정규식을 이용해서 이메일을 확인할 수 있다.
소스>
var reg = /^([0-9a-zA-Z_\.-]+)@([0-9a-zA-Z_-]+)(\.[0-9a-zA-Z_-]+){1,2}$/;
사용 예:jQuery>
<form name="f" method="post" action="폼 전송 주소">
<input type="text" id="email" name="email" maxlength="40" />
<input type="button" value="확인" onclick="btnSubmit()" />
</form>
<script type="text/javascript">
<!--
// 정규식 : 이메일
function chkEmail(str)
{
var reg_email = /^([0-9a-zA-Z_\.-]+)@([0-9a-zA-Z_-]+)(\.[0-9a-zA-Z_-]+){1,2}$/;
if(!reg_email.test(str))
{
return false;
}
return true;
}
// 폼 전송
function btnSubmit()
{
// 확인 : 이메일
$('#email').val($('#email').val().trim()); // javascript를 이용해서 trim() 구현하기 바로가기
if(!chkEmail($('#email').val()))
{
alert('이메일을 확인하세요.');
$('#email').focus();
return false;
}
//document.f.submit();
}
//-->
</script>
자바스크립트 정규식을 이용해서 비밀번호 형식을 확인할 수 있다.
소스> 영문, 숫자 혼용해서 6~20자 이내
var reg = /^.*(?=.{6,20})(?=.*[0-9])(?=.*[a-zA-Z]).*$/;
사용 예:jQuery>
<form name="f" method="post" action="폼 전송 주소">
<input type="password" id="pwd" name="pwd" maxlength="20" />
<input type="button" value="확인" onclick="btnSubmit()" />
</form>
<script type="text/javascript">
<!--
// 정규식 : 비밀번호
function chkPwd(str)
{
var reg_pwd = /^.*(?=.{6,20})(?=.*[0-9])(?=.*[a-zA-Z]).*$/;
if(!reg_pwd.test(str))
{
return false;
}
return true;
}
// 폼 전송
function btnSubmit()
{
// 확인 : 비밀번호
$('#pwd').val($('#pwd').val().trim()); // javascript를 이용해서 trim() 구현하기 바로가기
if(!chkPwd($('#pwd').val().trim()))
{
alert('비밀번호를 확인하세요.(영문,숫자를 혼합하여 6~20자 이내)');
$('#pwd').val('');
$('#pwd').focus();
return false;
}
//document.f.submit();
}
//-->
</script>
자바스크립트 정규식을 이용해서 이름 형식을 확인할 수 있다.
소스>
// 한글 이름 2~4자 이내
var reg = /^[가-힣]{2,4}$/;
// 영문 이름 2~10자 이내 : 띄어쓰기(\s)가 들어가며 First, Last Name 형식
var reg = /^[a-zA-Z]{2,10}\s[a-zA-Z]{2,10}$/;
// 한글 또는 영문 사용하기(혼용X)
var reg = /^[가-힣]{2,4}|[a-zA-Z]{2,10}\s[a-zA-Z]{2,10}$/; // "|"를 사용
사용 예:jQuery>
<form name="f" method="post" action="폼 전송 주소">
<input type="text" id="name" name="name" maxlength="4" />
<input type="button" value="확인" onclick="btnSubmit()" />
</form>
<script type="text/javascript">
<!--
// 정규식 : 이름
function chkName(str)
{
var reg_name = /^[가-힣]{2,4}$/;
if(!reg_name.test(str))
{
return false;
}
return true;
}
// 폼 전송
function btnSubmit()
{
// 확인 : 이름
$('#name').val($('#name').val().trim()); // javascript를 이용해서 trim() 구현하기 바로가기
if(!chkName($('#name').val()))
{
alert('이름을 확인하세요.(한글 2~4자 이내)');
$('#name').focus();
return false;
}
//document.f.submit();
}
//-->
</script>
javascript에서 왼쪽과 오른쪽 공백을 없애는 trim을 정규식으로 구현할 수 있다.
소스>
String.prototype.trim = function()
{
return this.replace(/^\s+|\s+$/g, "");
}
jQuery 사용 예>
$('#name').val($('#name').val().trim());
javascript 사용 예>
document.getElementById('name').value = document.getElementById('name').value.trim();
사용 예>
<form name="f" method="post" action="폼 전송 주소">
<input type="text" id="name" name="name" maxlength="4" />
<input type="button" value="확인" onclick="btnSubmit()" />
</form>
<script type="text/javascript">
<!--
// 정규식 : trim()
String.prototype.trim = function()
{
return this.replace(/^\s+|\s+$/g, "");
}
// 폼 전송
function btnSubmit()
{
// 확인 : 이름
$('#name').val($('#name').val().trim());
//document.f.submit();
}
//-->
|
