jquery verify.js 양식의 기본 사용법 시작하기 검증_jquery
- WBOY원래의
- 2016-05-16 18:27:37973검색
선배님이 쓴 글을 제가 이해한 바에 따라 수정하고 기록용으로만 여기에 전재합니다.
먼저 국내 대기업 코드 게시 :
코드 복사 코드는 다음과 같습니다
javascript">
$( document).ready(function() {
$("#loginForm").validate({
규칙: {
u이메일: {
필수: true ,
이메일: true
},
uPassword: {
필수: true,
범위 길이: [6, 30]
}
},
메시지: {
u이메일: {
필수: lang('ls_input_myb'),
이메일: lang('ls_myb_email')
},
uPassword: {
필수: lang('ls_login_password' ),
범위 길이: $.format(lang('ls_password_length'))
}
},
errorPlacement: function(error, element) {
var 배치 = $(element.parent ("td").parent(" tr").next("tr").find("td").get(1))
placement.text(''); ( 배치 );
onkeyup: false
})
var accountTipsText = lang('ls_account_email')
$("#uEmail").focus(function() {
if (!$( $(this).parent().parent().next().find('td').get(1)).text()) {
$($ (this).parent().parent ().next().find('td').get(1)).html('' accountTipsText ' ');
$(this).css('color', '#000')
}).focus()
}); ;
사실 이 예제는 jquery.validate.js의 핵심을 거의 담고 있습니다.
선물 웹페이지의 온라인 시뮬레이션을 할 때 판단을 위해 코드를 직접 작성했던 기억이 나네요... 너무 순진했습니다...
다음은 기사의 전체 소개입니다.
기본 확인 규칙
(1)필수:true 필수 필드
(3) email: true 이메일을 올바른 형식으로 입력해야 합니다
(4)url:true URL을 올바른 형식으로 입력해야 합니다
(5)date:true 날짜를 올바른 형식으로 입력해야 합니다
(6)dateISO:true 올바른 형식을 입력해야 합니다. 날짜(ISO) 형식을 입력해야 합니다. 예: 2009-06-23, 1998/01/22 유효성이 아닌 형식만 확인하세요.
(7)번호: true 유효한 숫자(음수, 소수)를 입력해야 합니다.
(8)digits:true 정수를 입력해야 합니다
(9)creditcard: 유효한 신용카드 번호를 입력해야 합니다
(10)equalTo:" #field" 입력 값은 #field와 동일해야 합니다
(11)accept: 유효한 접미사(업로드된 파일의 접미사)가 있는 문자열을 입력하세요.
(12)maxlength:5 최대 길이 5자(한자는 1자로 계산)
(13)minlength:10 최소 입력 길이는 10자 문자열(한자는 1자로 계산)
(14)rangelength:[5,10 ] 입력 길이는 5~10" 사이의 문자열이어야 합니다. (한자는 1자로 계산됩니다.)
(15) 범위:[5,10] 입력 값은 5~10 사이여야 합니다
(16) max:5 입력값은 5보다 클 수 없습니다.
(17)min:10 입력값은 10보다 작을 수 없습니다.
기본 팁
코드 복사
코드는 다음과 같습니다. messages: { required: "이 필드는 필수입니다.", remote: "이 필드를 수정하세요. .", email: "유효한 이메일 주소를 입력하세요.",
url: "유효한 URL을 입력하세요.", date: "유효한 날짜를 입력하세요.",
dateISO : "유효한 날짜(ISO)를 입력하세요.",
dateDE: "Bitte geben Sie ein gumeltiges Datum ein.",
number : "유효한 숫자를 입력하세요.",
numberDE: "Bitte geben Sie eine Nummer ein.",
digits: "숫자만 입력하세요.",
creditcard: "유효한 신용카드 번호를 입력하세요.",
equalTo: "같은 값을 다시 입력하세요." ,
accept: "유효한 확장자와 함께 값을 입력하세요.",
maxlength: $.validator.format("{0}자 이하로 입력하세요."),
minlength: $. validator.format("최소 {0}자를 입력하세요."),
rangelength: $.validator.format("{0}에서 {1}자 사이의 값을 입력하세요."),
range: $.validator.format("{0}에서 {1} 사이의 값을 입력하세요."),
max: $.validator .format("{0}보다 작거나 같은 값을 입력하세요. "),
min: $.validator.format("{0} 이상의 값을 입력하세요.")
},
수정이 필요한 경우 js 코드에 추가할 수 있습니다.
jQuery.extend(jQuery.validator.messages, {
required: "필수 필드",
remote: "이 필드를 수정하세요.",
email: " 올바른 이메일 형식을 입력하세요." ,
url: "법적 URL을 입력하세요.",
date: "법적 날짜를 입력하세요.",
dateISO: "법적 날짜(ISO)를 입력하세요. ",
number: " 유효한 숫자를 입력하세요.",
digits: "정수만 입력할 수 있습니다.",
creditcard: "적법한 신용카드 번호를 입력하세요.",
equalTo: "다음을 입력하세요. 다시 동일한 값",
accept: "적법한 접미사가 있는 문자열을 입력하세요.",
maxlength: jQuery.validator.format("길이가 최대 {0}인 문자열을 입력하세요."),
minlength: jQuery.validator.format("길이가 {0} 이상인 문자열을 입력하세요."),
rangelength: jQuery.validator.format("길이가 {0} 사이인 문자열을 입력하세요. 및 {1}") ,
range: jQuery.validator.format("{0}에서 {1} 사이의 값을 입력하세요."),
max: jQuery.validator.format("값을 입력하세요. 최대값은 { 0}개입니다."),
min: jQuery.validator.format("최소값은 {0}개로 입력하세요.")
});
권장 연습을 통해 이 파일을 message_cn.js에 넣고
페이지
1. 컨트롤에 확인 규칙을 작성합니다
dateISO : "유효한 날짜(ISO)를 입력하세요.",
dateDE: "Bitte geben Sie ein gumeltiges Datum ein.",
number : "유효한 숫자를 입력하세요.",
numberDE: "Bitte geben Sie eine Nummer ein.",
digits: "숫자만 입력하세요.",
creditcard: "유효한 신용카드 번호를 입력하세요.",
equalTo: "같은 값을 다시 입력하세요." ,
accept: "유효한 확장자와 함께 값을 입력하세요.",
maxlength: $.validator.format("{0}자 이하로 입력하세요."),
minlength: $. validator.format("최소 {0}자를 입력하세요."),
rangelength: $.validator.format("{0}에서 {1}자 사이의 값을 입력하세요."),
range: $.validator.format("{0}에서 {1} 사이의 값을 입력하세요."),
max: $.validator .format("{0}보다 작거나 같은 값을 입력하세요. "),
min: $.validator.format("{0} 이상의 값을 입력하세요.")
},
수정이 필요한 경우 js 코드에 추가할 수 있습니다.
코드 복사 코드는 다음과 같습니다. 다음:
jQuery.extend(jQuery.validator.messages, {
required: "필수 필드",
remote: "이 필드를 수정하세요.",
email: " 올바른 이메일 형식을 입력하세요." ,
url: "법적 URL을 입력하세요.",
date: "법적 날짜를 입력하세요.",
dateISO: "법적 날짜(ISO)를 입력하세요. ",
number: " 유효한 숫자를 입력하세요.",
digits: "정수만 입력할 수 있습니다.",
creditcard: "적법한 신용카드 번호를 입력하세요.",
equalTo: "다음을 입력하세요. 다시 동일한 값",
accept: "적법한 접미사가 있는 문자열을 입력하세요.",
maxlength: jQuery.validator.format("길이가 최대 {0}인 문자열을 입력하세요."),
minlength: jQuery.validator.format("길이가 {0} 이상인 문자열을 입력하세요."),
rangelength: jQuery.validator.format("길이가 {0} 사이인 문자열을 입력하세요. 및 {1}") ,
range: jQuery.validator.format("{0}에서 {1} 사이의 값을 입력하세요."),
max: jQuery.validator.format("값을 입력하세요. 최대값은 { 0}개입니다."),
min: jQuery.validator.format("최소값은 {0}개로 입력하세요.")
});
권장 연습을 통해 이 파일을 message_cn.js에 넣고
페이지
1. 컨트롤에 확인 규칙을 작성합니다
코드를 복사합니다 코드는 다음과 같습니다.