영문만, 숫자만, 한글만 입력.
페이지 정보
본문
<script type="text/javascript">
// 한글 영어만
$(".name_blank input").keyup(function(event) {
if (!(event.keyCode >= 37 && event.keyCode <= 40)) {
var inputVal = $(this).val();
$(this).val(inputVal.replace(/[^(ㄱ-힣a-zA-Z)]/gi, ''));
}
});
=>>>>> 상단 빨간색 정규식 부분을 기호에 맞추 수정하면 된다
$(document).ready(function(){
$("#input1").keyup(function(event){
if(event.keyCode !=8){
var result = "keycode="+ event.keyCode + " value="+ String.fromCharCode(event.keyCode);
var preHtml = $("#result").html();
$("#result").html(preHtml+ "<br />" +result);
}
if($(this).val() ==""){
$("#result").empty();
}
});
$("#onlyNumber").keyup(function(event){
if (!(event.keyCode >=37 && event.keyCode<=40)) {
var inputVal = $(this).val();
$(this).val(inputVal.replace(/[^0-9]/gi,''));
}
});
$("#onlyAlphabet").keyup(function(event){
if (!(event.keyCode >=37 && event.keyCode<=40)) {
var inputVal = $(this).val();
$(this).val(inputVal.replace(/[^a-z]/gi,''));
}
});
$("#notHangul").keyup(function(event){
if (!(event.keyCode >=37 && event.keyCode<=40)) {
var inputVal = $(this).val();
$(this).val(inputVal.replace(/[^a-z0-9]/gi,''));
}
});
$("#onlyHangul").keyup(function(event){
if (!(event.keyCode >=37 && event.keyCode<=40)) {
var inputVal = $(this).val();
$(this).val(inputVal.replace(/[a-z0-9]/gi,''));
}
});
});
</script>
숫자만: <input type="text" id="onlyNumber" /> <br />
영문만: <input type="text" id="onlyAlphabet" /> <br />
영문,숫자만:<input type="text" id="notHangul" /><br />
한글만:<input type="text" id="onlyHangul" /><br />
keyCode: <input type="text" id="input1" />
<div id="result"></div>
############## 정규표현식
1. 확장문자 (: backslash)
- s : 공백 문자(스페이스, 탭, 폼 피드, 라인 피드)
- b : 단어의 경계
- B 이를 제외한 모든 문자 매칭
- d : 숫자
- D : 숫자가 아닌 문자 [^0-9] 와 동일
- w : 알파벳, 숫자로 된 문자, 밑줄 기호(_) [A-Za-z0-9]
- W : w의 반대 문자 [^A-Za-z0-9]
- 특수문자 : 특수문자 자체를 의미 예) + (+ 기호 자체)
2. 특수문자
- * : 0회 이상 반복
- + : 1회 이상 반복
- ? : 0 또는 1개의 문자 매칭
- . : 정확히 1개 문자 매칭
3. 플래그
- g : 전역매칭
- i : 대소문자 무시
- m : 여러 줄 매칭
4. 기타
- () : 괄호로 묶인 패턴은 매칭된 다음, 그 부분을 기억한다.
- $1,...,$9 : 괄호로 갭처한 부분 문자열이 저장 됨.
- | : ~또는~
- {} : 반복 횟수
############## 간단한 정규 표현식
var re = /a/ --a 가 있는 문자열
var re = /a/i --a 가 있는 문자열, 대소문자 구분 안함
var re = /apple/ -- apple가 있는 문자열
var re = /[a-z]/ -- a~z 사이의 모든 문자
var re = /[a-zA-Z0-9]/ -- a~z, A~Z 0~9 사이의 모든 문자
var re = /[a-z]|[0-9]/ -- a~z 혹은 0~9사이의 문자
var re = /a|b|c/ -- a 혹은 b 혹은 c인 문자
var re = /[^a-z]/ -- a~z까지의 문자가 아닌 문자("^" 부정)
var re = /^[a-z]/ -- 문자의 처음이 a~z로 시작되는 문장
var re = /[a-z]$/ -- 문자가 a~z로 끝남
상기에 정의된 간단한 표현식을 아래에 넣어 직접 해 보시기 바랍니다.
var str = "sample string";
re.test(str)?"true":"false";
* 특수문자('''', ''^'', ''$'', ''*'', ''+'', ''?'', ''.'', ''('', '')'', ''|'', ''{'', ''}'', ''['', '']'')를 검색할 경우는 '''' 를 넣는다.
############## 간단한 응용예제
var re = /s$/; -- 공백체크
var re = /^ss*$/; -- 공백문자 개행문자만 입력 거절
var re = /^[-!#$%&'*+./0-9=?A-Z^_a-z{|}~]+@[-!#$%&'*+/0-9=?A-Z^_a-z{|}~]+.[-!#$%&'*+./0-9=?A-Z^_a-z{|}~]+$/; --이메일 체크
var re = /^[A-Za-z0-9]{4,10}$/ -- 비밀번호,아이디체크 영문,숫자만허용, 4~10자리
var re = new RegExp("(http|https|ftp|telnet|news|irc)://([-/.a-zA-Z0-9_~#%$?&=:200-377()]+)","gi") -- 홈페이지 체크
var re = "<[^<|>]*>"; -- 태그제거
var re = /[<][^>]*[>]/gi;-- 태그제거
str = str.replace(RegExpTag,"");
var RegExpHG = "[ㄱ-ㅎ가-힣]"; -- 한글 제거
str = str.replace(RegExpHG,"");
var RegExpDS = //g; -- 주석 제거
str6 = str.replace(RegExpDS,"");
var regExp = /[a-z0-9]{2,}@[a-z0-9-]{2,}.[a-z0-9]{2,}/i; --이메일 체크
## 기타 응용
re = new RegExp("^@[a-zA-Z0-9]+s+","i");//문장의 처음이 @이고 문자가 1나 이상 있으면 ok
기타 상기와 동일하나 약간씩 다른 샘플
영숫자 조합책크
if ((new RegExp(/[^a-z|^0-9]/gi)).test(frm.loginid.value)) {
alert("ID는 영숫자 조합만 사용하세요");
frm.loginid.focus();
}
홈페이지 주소 책크
function chk(v){
str='';
re = new RegExp("^http://","i");
re.test(v)?str='y':str='n';
alert(str);
}
hanmail인지를 책크
function chk(v){
str='';
re = new RegExp("hanmail.net","i");
re.test(v)?str=true:str=false;
return str
}
//본문내에서 도메인 구하기
var patt = /(http(s)?://)?w+(.w+)+/gi;
var result = (aa.value.match(patt));
//본문내에서 url구하기
상기와 유사 var patt = /(http(s)?://)?w+(.w+).S*/gi;
########### 정규식 메소드 및 사용법
참조 http://eknote.tistory.com/1251">http://eknote.tistory.com/1251" target="_blank">http://eknote.tistory.com/1251">http://eknote.tistory.com/1251">http://eknote.tistory.com/1251" target="_blank">http://eknote.tistory.com/1251
참조 www.javascriptkit.com="" javatutors="" redev3.shtml""="" target="_blank">http://www.javascriptkit.com/javatutors/redev3.shtml">http://www.javascriptkit.com/javatutors/redev3.shtml" target="_blank">http://www.javascriptkit.com/javatutors/redev3.shtml">www.javascriptkit.com="" javatutors="" redev3.shtml""="" target="_blank">http://www.javascriptkit.com/javatutors/redev3.shtml">http://www.javascriptkit.com/javatutors/redev3.shtml" target="_blank">http://www.javascriptkit.com/javatutors/redev3.shtml
RegExp.exec(string)
RegExp.test(string)
String.match(pattern)
String.search(pattern)
String.replace(pattern,string)
String.split(pattern)
회원 가입 폼 체크에서 jQuery Validation 플러그인을 활용하면 폼 체크를 비교적 간단히 할 수 있다.
$(function() {
$.validator.setDefaults({
onkeyup:false,
onclick:false,
onfocusout:false,
showErrors:function(errorMap, errorList){
if(this.numberOfInvalids()) {
alert(errorList[0].message);
}
}
});
$(‘form[name=fmember]’).validate({
rules: {
mb_id: { required: true, minlength: 4 },
mb_password: { required: true, minlength: 6 },
mb_password_re: { equalTo: “#mb_password” },
mb_name: “required”,
mb_birth: “required”,
mb_zip1: “required”,
mb_addr2: “required”,
tel1: “required”,
tel2: “required”,
hp1: “required”,
hp2: “required”,
hp3: “required”,
mb_email: { required: true, email: true }
},
messages: {
mb_id: {
required: “아이디를 입력해 주십시오.”,
minlength: “아이디를 4글자 이상 입력해 주십시오.”
},
mb_password: {
required: “비밀번호를 입력해 주십시오.”,
minlength: “비밀번호를 6글자 이상 입력해 주십시오.”
},
mb_password_re: {
equalTo: “비밀번호가 일치하지 않습니다.”
},
mb_name: {
required: “성명을 입력해 주십시오.”
},
mb_zip1: {
required: “주소를 입력해 주십시오.”
},
mb_addr2: {
required: “상세주소를 입력해 주십시오.”
},
tel1: {
required: “전화번호를 입력해 주십시오.”
},
tel2: {
required: “전화번호를 입력해 주십시오.”
},
hp1: {
required: “휴대전화번호를 입력해 주십시오.”
},
hp2: {
required: “휴대전화번호를 입력해 주십시오.”
},
hp3: {
required: “휴대전화번호를 입력해 주십시오.”
},
mb_email: {
required: “이메일 주소를 입력해 주십시오.”,
email: “올바른 형식의 이메일 주소를 입력해 주십시오.”
},
mb_birth: {
required: “생년월일을 입력해 주십시오.”
}
},
submitHandler: function(form) {
var pattern1 = /(^[a-zA-Z])/;
var pattern2 = /([^a-zA-Z0-9-_])/;
var mb_id = $.trim($(‘input[name=mb_id]’).val());
if(!pattern1.test(mb_id)){
alert(“아이디의 첫글자는 영문이어야 합니다.”);
return false;
}
if(pattern2.test(mb_id)){
alert(“아이디는 영문, 숫자, -, _ 만 사용할 수 있습니다.”);
return false;
}
form.submit();
}
});
});
- 이전글페이지 변화없이 table검색하여 보여주기 18.10.22
- 다음글table 목록 순서 드래그로 바꾸기 18.10.13
댓글목록
등록된 댓글이 없습니다.