> 웹 프론트엔드 > JS 튜토리얼 > FormValidate 양식 유효성 검사 함수 코드가 업데이트되어 download_javascript 기술에 사용 가능

FormValidate 양식 유효성 검사 함수 코드가 업데이트되어 download_javascript 기술에 사용 가능

WBOY
풀어 주다: 2016-05-16 19:01:50
원래의
1297명이 탐색했습니다.

FormValidate 기능 업데이트

다운로드:
http://xiazai.jb51.net/jslib/FormValidate.rar

자세한 사용법은 다음을 참조하세요:

http ://jobj.googlecode.com/svn/trunk/FormValidate/demo.html

방법 추가:
extend,
확인 모드 추가 4, 3과 동일하지만 확인에 실패하는 경우 , 아래쪽 확인을 즉시 중지하십시오. 모드 3에서는 오류가 발생하면 오류를 기록하고 하향 점검합니다. 모드 4에서는 하향 점검이 없습니다.


사용법:




. . . . .
. . . . .
var checkRule = [
{name:"name[0]", 필수:true, min:2, max:3, msg:"이름을 입력하세요! 길이는 2보다 크고 2보다 작아야 합니다. 3"},
{이름:"생일[0]",필수:false, 유형:"날짜", msg:"생년월일은 선택사항입니다. 입력한 경우 올바른 날짜를 입력하세요."},
{이름:"이메일 [0]", 필수:false, 유형:"이메일", msg:"이메일은 선택사항입니다. 입력한 경우 올바른 이메일 주소를 입력하세요."},
{이름:"scoreA[0] ", 필수: true, 유형: "Num", min:0, max:100, msg: "중국어 점수는 필수입니다. 0보다 크고 100보다 작아야 합니다."},
{name:"scoreB [0]", 필수:true, 유형:"숫자", 최소:0, 최대:100, msg:"수학적 점수는 필수이며 0보다 크고 100보다 작아야 합니다."},
{이름:" ScoreC[0]", 필수:true, 유형: "숫자", 최소:0, 최대:100, msg:"영어 점수는 필수이며 0보다 크고 100보다 작아야 합니다."}
];

JObj.plugin("FormValidate");
var va = JObj.Plugin.FormValidate;

va.extend(document.forms[0],"ruleTpl",checkRule)
return va.validate(document.forms[0],checkRule ,4);

설명:
왜 이렇게 쓰여 있나요?
양식 항목을 동적으로 추가하지 않으려면 va.extend 문장을 삭제하면 됩니다. 그러나 양식 항목을 동적으로 추가하는 경우. . . 새 양식 항목을 지정할 수 없습니다.
이렇게 작성하면 ruleTpl에서 지정한 검증 규칙입니다. 이 ruleTpl은 값이 아닌 임의의 문자열일 수 있습니다. 예를 들어 ruleTpl이 ttt로 대체되면 다음과 같이 작성해야 합니다.
va.extend(document.forms[0],'ttt',checkRule)
ruleTpl은 양식 항목의 사용자 정의 속성으로 존재하며 해당 값은 checkRule의 첨자여야 합니다. 이 첨자가 없으면 이 항목은 기본적으로 검사되지 않습니다. 그렇지 않으면 선택한 checkRule 요소를 복사하여 확인 규칙을 동적으로 추가하는 목적을 달성하세요.

이 기능을 추가할 때 몇 가지 흥미로운 문제가 발생했습니다. 아래에서 이에 대해 설명하겠습니다.

1. 주소 참조를 실행하지 마세요. 다음 코드.

var a = [{name:1}];
var tmp = a.push(a[a.length - 1])
a[tmp - 1].name = 2 ;
a = [{name:1},{name:2}]라고 말하면 실제 값은 다음과 같습니다.
a = [{name:2},{ name: 2}];

푸시되는 것이 객체이고 객체가 JS의 주소 참조이기 때문에 이유는 매우 간단합니다. 따라서 a[tmp - 1].name = 2이면 실제로는 변경 a [0]의 값이 변경되었습니다.

다음 단락은 매우 간단하며 값 참조이므로 위의 상황은 발생하지 않습니다.


var a = [1,2,3];
a.push(a[a.length - 1])
alert(a); a.length - 1] = 4;
alert(a)
2, FF에서 양식 항목을 동적으로 삭제합니다.
양식 항목이 경고 없이 동적으로 삭제되는 경우 form['itemName']은 여전히 ​​삭제된 양식 항목입니다.
이때 parentNode와 form이 모두 null인데 parentNode == null로 판단할 수 없습니다. 왜인지는 모르겠지만 FF가 기능을 완성하려면 item을 사용해야 합니다. .form == null로 판단하려면 다음과 같이 합니다.

if (obj == 정의되지 않음 || obj.form == null) return null

IE에는 이 문제가 없습니다.

관련 라벨:
js
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿