javaScript : 폼제어

javaScript의 꽃 폼 제어

이 부분을 잘 봐 둬야 왜 자바스크립트를 썼는지 감이 온다.

기본적으로 Form안에 여러 가지 버튼이나 text상다들이 속해야 스크립트랑 함께 구동이 된다.

 

form과 스크립트

javascript는 폼이 사용된 문서에서 자주 사용된다.

폼은 회원가입, 게시판, 로그인 등이 사용된 문서에 자주 사용된다.

    - 꼭 입력해야 할 필드에 사용자가 값을 입력하지 않았을 때 경고

    - 원래 정해진 형식대로 입력했는지 체크하는 기능

             예) 이메일 주소 형식, 지정한 길이 초과, 유효한 주민번호인지 체크

 

Form객체

<form name="myform" method="post" action="receive.asp">

    -  document.form.메소드()

    - document.myform.프로퍼티

    - document.myform.하위객체명.메소드()

    - document.myform.하위객체명.프로퍼티

 

객체 계층구조

Form객체의 메서드

    - submit()  //제출

    - reset()

---

java를 이용해 텍스트 필드에 접근

   - document.폼이름.텍스트필드이름

 

Text객체의 프로퍼티

    -  name : 텍스트 필드 이름

    -  value : 사용자가 택스트 필드에 입력하는 내용

             - 필드가 비워있는지 체크 : if(document.myform.id.value=="")~

             - 필드 값 비우기 : document.myform.id.value="";

             - 필드 입력 내용의 길이 : document.myform.id.value.length

 

Text객체의 메서드 

    -  focus() : 해당 텍스트 필드에 포커스 지정

          document.myform.id.focus();  

    -  blur() : 텍스트 필드에서 포커스를 제거

          document.myform.id.blur();

    -  select() : 텍스트 필드 안의 텍스트를 선택

          document.myform.id.select();

 

 

---

form 태그의 action 속성

<form>태그의 action 속성은 폼데이터(form data)를 서버로 보낼때 해당 데이터가 도착할 url명을 명시한다.

 

속성값	설명
URL	서식 데이터(form data)를 서버로 보낼 때 해당 데이터가 도착할 URL   1. 절대 주소(absolute URL) ex) href=“절대 경로” 2. 상대 주소(relative URL) ex) href=“상대주소”

---

출처 : JavaScript : 폼제어 : 네이버 블로그 (naver.com)