집 >웹 프론트엔드 >JS 튜토리얼 >Jquery 연습 양식 유효성 검사 구현 code_jquery

Jquery 연습 양식 유효성 검사 구현 code_jquery

WBOY원래의: 2016-05-16 18:13:59860검색

Jquery 연습 양식 유효성 검사

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

🎜>< ;form action="" method="post" id ="myform">

이름: 🎜>< ;td>

;td> 연령:

< ; tr>

입력 유형 ="checkbox" id = "cbOnTheInternet" "checkbox" value ="Online" selected="checked">Online
여행
< input type ="checkbox" id = "cbWatchingTv" name="checkbox" value="영화 보기">영화 보기

;

Jquery 코드

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

$(document).ready( function() {
$("#myform ").submit(function() {
var 사용자 이름=$("#name").val();

var age=$("#age").val() var sex =$("input[name = 'sex'][checked]").val(); var address=$("#add option[selected]").val(); var size= $("input[name=' checkbox'][checked]").size(); var favoriteArray=Array(size); $("input[name='checkbox'][ selected]").each(function (index,docEl){

favouriteArray[index]=$(this).val();// 또는 docEl.value

}) 
if(username= ="") 
{ 
alert("성명은 비워둘 수 없습니다! "); 
$("#name").focus(); 
 false 반환; 
} 
if(age=="") 
{ 
alert("Age 비워둘 수 없음"); 
$("#age").focus(); 
 false 반환; 
} 
if(size==0) 
{ 
alert( "아직 취미를 선택하지 않으셨습니다!"); 
$("input[name='checkbox']").get(0).focus() 
return false; 🎜> for(var i=0;ialert(favouriteArray[i]) 
} 
alert('제출 성공!') 
}) ; 

}) 

성명：

이전 기사：노드 작업을 위한 API, HTML DOM 노드 작업을 위한 기본 API를 전복_javascript 기술다음 기사：노드 작업을 위한 API, HTML DOM 노드 작업을 위한 기본 API를 전복_javascript 기술

<입력 유형 ="text" id="age" name ="age">
성별:	<입력 유형 = "radio" id="sex_man" name="sex" value="male "> 남성여성
주소:
취미:
<입력 유형 ="제출" 값="제출"

Jquery 연습 양식 유효성 검사 구현 code_jquery

관련 기사