JSP 입문 강좌 의 클 라 이언 트 검증,상용 출력 방식 및 JSTL 기본 용법

14954 단어 JSP검증 하 다.출력JSTL
본 고 는 JSP 입문 강좌 의 클 라 이언 트 검증,상용 출력 방식 과 JSTL 기본 용법 을 다 루 었 다.모두 에 게 참고 하도록 공유 하 다.구체 적 으로 다음 과 같다.
1.목표:
① 클 라 이언 트 검증 의 기본 과정 파악;
② JSP 가 정 보 를 출력 하 는 방식 을 파악 한다.
③ JSTL 의 기본 적 인 용법 을 파악 한다.
2.주요 내용:
① 사례 를 통 해 클 라 이언 트 검증 의 기본 과정 을 소개 한다.
② JSP 가 정 보 를 출력 하 는 기본 방식 을 소개 한다.
③ 사례 분석 을 통 해 JSTL 의 기본 적 인 용법 을 소개 한다.
클 라 이언 트 인증 과 관련 된 코드 는 네트워크 곳곳에서 볼 수 있 고 매우 통용 되 기 때문에 일반적인 상황 에서 여러분 이 직접 작성 할 필요 가 없 지만 어떻게 사용 하고 수정 하 는 지 알 아야 합 니 다.다음은 기본 적 인 사용 과정 을 소개 한다.
1.JavaScript 코드 를 어떻게 삽입 합 니까?
JavaSript 코드 를 사용 하여 사용자 가 정 보 를 입력 하 는 클 라 이언 트 인증 을 완 료 했 습 니 다.페이지 에 JavaScript 코드 를 삽입 하 는 과정 은 다음 과 같 습 니 다.

<script language="JavaScript">
 //      JavaScript  
</script>
자 바스 크 립 트 코드 는 이 시작 표지 와 끝 표지 사이 에 있어 야 합 니 다.
2、자 바스 크 립 트 작성 방법
각종 검증 과정 은 방법의 형식 으로 존재 합 니 다.JavaScript 방법의 정의 방식 은 다음 과 같 습 니 다.

function    (    )
{
 //    
}
자바 의 방법 정의 와 달리 function 성명 은 방법 을 정의 하려 고 합 니 다.값 형식 을 되 돌려 주지 않 아 도 되 고 임의의 결 과 를 되 돌려 줄 수 있 습 니 다.매개 변수 목록 은 매개 변수의 유형 을 제시 하지 않 아 도 됩 니 다.다음은 하나의 방법의 예 이다.

function validate(form)
{
 …
}
다음은 매개 변수 가 숫자 인지 아 닌 지 를 판단 하 는 방법 입 니 다.

//        
function isNumber(str)
{
  for(i=0;i<str.length;i++)
  {
   //        ，       
   if(str.charAt(i)>='0' && str.charAt(i)<='9'
    || str.charAt(i)=="-" && i==0)
    continue;
   else
    return false;
  }
  return true;
}
3.양식 제출 과 검증 방법 간 의 관 계 를 어떻게 구축 합 니까?
폼 form 을 사용 한 onsubmit 이벤트 가 완료 되 었 습 니 다.

<form name="form1" method="post"
action="process.jsp" onsubmit="return isValidate(form1)">
그 중에서 onsubmit="return isValidate(form 1)"부분 은 검증 방법 에 대한 호출 입 니 다.
메모:이 때 는 form 의 제출 이 벤트 를 사용 하고 제출 단 추 를 사용 합 니 다.
제출 단 추 를 일반 단추 로 수정 한 다음 단 추 를 사용 한 onClick 이벤트 호출 검증 방법 도 가능 합 니 다.
4.검증 을 할 때 입력 한 정 보 를 가 져 와 야 합 니 다.가 져 오 면?
폼 의 이름 은 폼 요소 까지 값 을 얻 습 니 다.예 를 들 면:
userid = form.userid.value;
변 수 는 정의 없 이 직접 사용 할 수 있 습 니 다.
5.인 스 턴 스:등록 기능 의 사용자 이름과 암 호 를 검증 합 니 다.

<%@ page contentType="text/html;charset=gb2312"%>
<script language="JavaScript">
 //        
 function isValidate(form){
  userid = form.userid.value;
  if(userid==""){
   alert("  ID    ");
   return false;
  }else if(userid.length>8 || userid.length<6){
   alert("     6－8 ");
   return false;
  }
  userpass=form.userpass.value;
  if(userpass.length!=8){
   alert("       8！");
   return false;
  }
  return true;
 }
</script>
   <br>
<form name="form1" method="post" action="process.jsp" onsubmit="return isValidate(form1)">
   ID：<input type="text" name="userid">  ID   6－8 <br>
   ：<input type="password" name="userpass">       8<br>
     ：<input type="password" name="userpass1"><br>
   ：<input type="radio" name="sex" value=" " checked> 
   <input type="radio" name="sex" value=" "> <br>
   ：<input type="checkbox" name="fav" value="  ">  
   <input type="checkbox" name="fav" value="  ">  
   <input type="checkbox" name="fav" value="  ">  <br>
   ：
  <select name="degree">
   <option value="  ">  </option>
   <option value="  ">  </option>
   <option value="  ">  </option>
   <option value="  ">  </option>
  </select><br>
   ：
  <textarea name="comment"></textarea><br>
  <input type="submit" value="  "><input type="reset" value="  ">
</form>
6.자주 사용 하 는 인증:regiest.jsp 파일 을 통 해 소개 합 니 다.
이 검증 은 가장 전면적 인 것 도 아니 고 가장 좋 은 것 도 아니다.만약 에 인터넷 을 통 해 찾 을 수 있다 면 자 바스 크 립 트 관련 서적 을 찾 아 볼 수 있 고 기 존의 자 바스 크 립 트 방법 을 많이 사용 할 수 있다.또한 클 라 이언 트 인증 을 할 때 정규 표현 식 을 사용 할 수 있 고 편리 합 니 다.
아래 코드 참고:

<%@ page contentType="text/html;charset=gb2312"%>
<script language="JavaScript">
 function isValidate(form)
 {
  //          
  userid = form.userid.value;
  username = form.username.value;
  userpass = form.userpass.value;
  userpass2 = form.userpass2.value;
  birthday = form.birthday.value;
  email = form.email.value;
  address = form.address.value;
  phone = form.phone.value;
  //     ID  
  if(!minLength(userid,6))
  {
   alert("  ID    6 ！");
   form.userid.focus();
   return false;
  }
  if(!maxLength(userid,8))
  {
   alert("  ID    8 ！");
   form.userid.focus();
   return false;
  }
  //        
  if(!minLength(username,6))
  {
   alert("       6 ！");
   form.username.focus();
   return false;
  }
  if(!maxLength(username,8))
  {
   alert("       8 ！");
   form.username.focus();
   return false;
  }
  //       
  if(!minLength(userpass,6))
  {
   alert("      6 ！");
   form.userpass.focus();
   return false;
  }
  if(!maxLength(userpass,8))
  {
   alert("      8 ！");
   form.userpass.focus();
   return false;
  }
  //             
  if(username==userpass)
  {
   alert("          ！");
   form.userpass.focus();
   return false;
  }
  //           
  if(userpass != userpass2)
  {
   alert("          ！");
   form.userpass.focus();
   return false;
  }
  //            
  if(!isDate(birthday))
  {
   alert("        ！");
   form.birthday.focus();
   return false;
  }
  //   email       
  if(!isEmail(email))
  {
   alert("Email     ！");
   form.email.focus();
   return false;
  }
  //              
  if(!isDigital(phone))
  {
   alert("          ");
   form.phone.focus();
   return false;
  }
  //            
  if(!maxLength(address,50))
  {
   alert("      50 ！");
   form.address.focus();
   return false;
  }
  return true;
 }
 //       
 function isNull(str)
 {
  if(str.length==0)
   return true;
  else
   return false;
 }
 //           
 function minLength(str,length)
 {
  if(str.length>=length)
   return true;
  else
   return false;
 }
 //           
 function maxLength(str,length)
 {
  if(str.length<=length)
   return true;
  else
   return false;
 }
 //        
 function isDigital(str)
 {
  for(i=0;i<str.length;i++)
  {
   //        
   if(str.charAt(i)>='0' && str.charAt(i)<='9'
    || str.charAt(i)=="-" && i!=0 && i!=str.length-1)
    continue;
   else
    return false;
  }
  return true;
 }
 //        
 function isNumber(str)
 {
  for(i=0;i<str.length;i++)
  {
   //        ，       
   if(str.charAt(i)>='0' && str.charAt(i)<='9'
    || str.charAt(i)=="-" && i==0)
    continue;
   else
    return false;
  }
  return true;
 }
 //        ，      1988-1-1
 function isDate(date)
 {
  //      
  index1 = date.indexOf("-");
  //         ，        
  if(index1 == -1)
   return false;
  //        
  year = date.substring(0,index1);
  //           
  date = date.substring(index1+1);
  //         
  index1 = date.indexOf("-");
  //            ，        
  if(index1 == -1)
   return false;
  //         
  month = date.substring(0,index1);
  //        
  day = date.substring(index1+1);
  //        ，            
  if(isNumber(year) && isNumber(month) && isNumber(day))
  {
   //       
   if(year<1900 || year>9999 || month<1 || month >12 || day<1)
    return false;
   //   31   
   if((month==1 || month==3 || month==5 || month==7
   || month==8 || month==10 || month==12) && day>31)
    return false;
   //   30   
   if((month==4 || month==6 || month==9 || month==11)
    && day>30)
    return false;
   //    2 ，       
   if(month==2)
   {
    if(year%400==0 || (year%4==0 && year%100!=0))
    {
     if(day>29)
      return false;
    }else
    {
     if(day>28)
      return false;
    }
   }
  }
  else
   return false;
  return true;
 }
 //      Email
 function isEmail(email)
 {
  if(email.length==0)
   return false;
  index1 = email.indexOf('@');
  index2 = email.indexOf('.');
  if(index1 < 1    // @     ，        
  || index2 < 1   // .     ，        
  || index2-index1 <2 // . @       
  || index2+1 == email.length) // .        
   return false
  else
   return true;
 }
</script>
<html>
 <head>
 <title>    </title>
 </head>
 <body>
 <h2 align="center">   </h2>
 <form name="form1" action="register_confirm.jsp" method="post"
   onsubmit="return isValidate(form1)">
  <table align="center">
   <tr><td>   ID：</td><td><input type="text" name="userid" value="${param.userid}"> </td></tr>
   <tr><td>   ID：</td><td><input type="text" name="userid"> </td></tr>
  <tr><td>    ：</td><td><input type="text" name="username"> </td></tr>
  <tr><td>   ：</td><td><input type="password" name="userpass"></td></tr>
  <tr><td>     ：</td><td><input type="password" name="userpass2"></td></tr>
  <tr><td>   ：</td><td><input type="text" name="birthday">   ：1988-1-1</td></tr>
  <tr><td>   ：</td><td>
   <input type="radio" name="degree" value="  ">  
   <input type="radio" name="degree" value="  " checked>  
   <input type="radio" name="degree" value="     ">     
   <input type="radio" name="degree" value="     ">     
   <input type="radio" name="degree" value="  ">  </td></tr>
  <tr><td>   ：</td><td>
   <select name="local">
    <option value="  ">  </option>
    <option value="  ">  </option>
    <option value="  ">  </option>
    <option value="  ">  </option>
    <option value="  ">  </option>
    <option value="  ">  </option>
    <option value="  ">  </option>
    <option value="  ">  </option>
    <option value="  ">  </option>
   </select></td></tr>
  <tr><td> E-mail:</td><td><input type="text" name="email"></td></tr>
  <tr><td>   ：</td><td><input type="text" name="address"></td></tr>
   <tr><td>   ：</td><td><input type="text" name="phone"></td></tr>
  <tr><td>   ：</td><td>
   <textarea rows="8" name="comment" cols="40"></textarea></td></tr>
  <tr><td> <input type="reset" value="  "></td><td>
   <input type="submit" value="  "></td></tr>
  <table>
 </form>
 </body>
</html>
7.주요 한 정 보 를 출력 하 는 방식
1）out.println("");
out 은 내부 대상 으로 직접 사용 할 수 있 지만 스 크 립 트(<%%>)에서 사용 해 야 합 니 다.되도록 적 게 쓰다.
2)직접 출력
정적 정보 라면 html 언어 에서 직접 사용 할 수 있 습 니 다.HTML 태그 포함.
3)표현 식<%=시작,%>로 종료
예 를 들 어<%="표현 식 으로 출력 한 정보"%>
4)표현 식 언어(EL)
중점적으로 파악 해 야 한다.
기본 형식:시작 표지${끝 표지}
다양한 정 보 를 출력 할 수 있 습 니 다:문자열 형식의 정보,대상,오류 알림 정보.
8.주석의 용법
홈 페이지 주석:
자바 주석://단일 주석/**/다 중 주석
JSP 주석:<%--JSP 주석  --%>
9.클 라 이언 트 에서 검증 을 했 습 니 다.서버 단계 에서 검증 이 필요 합 니까?
필요 하 다
원인:클 라 이언 트 는 입력 인터페이스 를 통 해 파일 에 직접 접근 하지 않 고 클 라 이언 트 인증 을 건 너 뛸 수 있 습 니 다.서버 인증 이 없 으 면 데이터 에 문제 가 생 길 수 있 습 니 다.
클 라 이언 트 가 진행 하 는 검증 은 주로 형식 적 인 검증 이 고 어떤 것들 은 서버 에서 검증 해 야 합 니 다.
10.JSTL 개요
표준 태그 라 이브 러 리 는 자바 코드 를 사용 하지 않 고 태그 로 이 루어 집 니 다.목 표 는 페이지 파일 에 자바 코드 가 나타 나 지 않 는 것 입 니 다.
표준 태그 라 이브 러 리 의 구성 부분:jstl.jar 와 standard.jar 두 개의 압축 패키지.
표준 태그 라 이브 러 리 사용 방법:
1)우선 두 개의 압축 패 키 지 를 WEB-INF/lib 아래 에 놓 아야 한다.두 개의 압축 패 키 지 는 라벨 라 이브 러 리 의 실현 파일 과 설명 파일 이다.
2)페이지 에서 먼저 설명 해 야 합 니 다.

<%@ taglib %> 。uri uri（ ）。
prefix ， 。

3）


" + " ， 。

JSP 。
JS 에서 FormData 클래스 구현 파일 업로드
js,jquery 구현 목록 모호 검색 기능 프로 세 스 분석

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage