JQuery 양식 유효성 검사 플러그인 EasyValidator 사용 분석_jquery

WBOY
풀어 주다: 2016-05-16 16:31:14
원래의
2409명이 탐색했습니다.

이 기사의 예에서는 JQuery 양식 유효성 검사 플러그인 EasyValidator의 사용법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 세부 내용은 다음과 같습니다.

이 플러그인의 목적은 다음과 같습니다. 사용자는 JS 인증 코드 한 줄을 작성할 필요가 없으며 인증할 양식에 해당 인증 속성을 추가하기만 하면 인증 기능을 쉽게 유지 관리하고 확장할 수 있습니다. , 사용하기가 더 쉽습니다.

DEMO에는 직접 재사용할 수 있는 일반적으로 사용되는 정규 표현식이 이미 포함되어 있습니다. 확장성을 고려하기 위해 다양한 사용자의 특별한 요구에 따라 자신만의 정규 표현식을 작성할 수 있습니다.

EasyValidator로 구현된 기능:

1. 프롬프트 기능(양식이나 기타 태그에 팁="메시지를 표시할 텍스트" 추가)

예:

코드 복사 코드는 다음과 같습니다.

또는

코드 복사 코드는 다음과 같습니다.

2. 일반 양식 확인(양식에 reg="정규 표현식" 추가)
예:

코드 복사 코드는 다음과 같습니다.

일반 양식 유효성 검사 데모: http://easyvalidator.googlecode.com/svn/trunk/index.html

3. AJAX 양식 확인(양식에 url="확인 시스템 주소" 추가)
예:

코드 복사 코드는 다음과 같습니다.

AJAX 검증 데모: 온라인 데모가 없습니다. ajax_demo.html을 로컬에서 실행하고 원격 PHP 파일을 요청하십시오. 물론 사용자가 참조할 수 있도록 프로그램에 일부 기존 데이터가 미리 설정되어 있습니다.

4. 일반 폼 검증 AJAX 폼 검증(일반 검증 통과 후 AJAX 검증 수행)
예:

코드 복사 코드는 다음과 같습니다.

5. 확장 기능 양식 유효성 검사(일부 특별한 비즈니스 요구 사항):

이러한 특별한 요구 사항은 비즈니스를 기반으로 합니다.

1. 체크박스를 최소 1개, 최대 5개까지 선택할 수 있도록 제한하는 등 체크박스 선택 상자 수를 확인합니다.
2. 여러 형식을 비교합니다. 예를 들어 [시작 시간 형식]은 [종료 시간 형식]보다 작거나 같아야 하며 등록 등에 사용할 때 두 개의 비밀번호 형식이 동일해야 합니다.

이 상황의 특수성으로 인해 사용자는 자신의 비즈니스 로직 코드를 작성해야 합니다. 공식에서는 확장 기능을 제공하고 그 안에 자신의 로직 코드를 작성하면 됩니다.

확장 함수 양식 유효성 검사 데모: http://easyvalidator.googlecode.com/svn/trunk/extends_demo.html

버그 수정 로그:
2010-9-24: 같은 페이지에서 여러 FORM 제출 버그 수정, TIP 위치 오류 버그
2010-9-26: IE6에서 TIP를 마스킹할 수 없는 문제를 해결하기 위해 bgiframe 플러그인 추가
2010-9-27: 확장 API 추가 및 핵심 라이브러리 재구성

2011-1-1 : 양식 검증의 TIP를 분리하여 TIP, URL, REG가 별도의 구성 요소로 존재하도록 하여 더욱 유연해졌습니다!

2011-1-28: AJAX TIP 오류 수정 버그 수정, 로직 수정, AJAX 요청의 원격 프로그램 verify_user.php 인코딩을 GB2312로 설정했습니다.

공식 다운로드 주소: http://code.google.com/p/easyvalidator/downloads/list

또는 여기를 클릭하여 이 사이트에서 다운로드하세요. http://www.jb51.net/jiaoben/32303.html

온라인 정규식 검사기: http://regexpal.com/

이 글이 모든 분들의 웹 프로그래밍 디자인에 도움이 되기를 바랍니다.

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