1. 보통 폼을 전송할 때 onsubmit 이벤트 핸들러를 이용하잖습니까

 

<form action="" METHOD=POST name=saveform onsubmit="return checksaveform();">

 <input type="text" name="fName">

  <input type="submit">

</form>

 

2. 근데 return이 있는 것과 없는 것의 차이점은 무엇인가요??, 즉 아래처럼 했을 때와 무슨 차이가 있죠??

<form action="" METHOD=POST name=saveform onsubmit="checksaveform();">

 

 

3. checksaveform함수는 다음과 같습니다.

--------------------------------------------------------------------

function checksaveform() {

  if (document.saveform.fName.value.length < 1) {
    alert("이름이 입력되지 않았습니다.");
    document.saveform.fName.focus();
    return false;
  }

  document.saveform.submit();
}

 




안녕하세요...

 

HTML 태그 중에는 기본적으로 이벤트 속성을 가지고 있는 태그들이 몇 있는 것은 알고 계실겁니다.

두가지를 예를 들자면, <A>태그와 지금 질문주신 <FORM> 태그도 있을 거구요..

 

앵커 태그의 경우는 사용자가 링크를 클릭하여 이벤트를 발생시키게 됩니다.

그런데 이러한 이벤트의 발생여부를 결정 짓는 것이 on이벤트 마다 존재합니다.

디폴트로는 true를 return 하고 있지요..

 

 

 

일단 설명이 잘 이해가 안되실 것 같아 코드상으로 예를 들어 보여 드리면 아래와 같습니다.

 

+ 아래와 같은 코드는 아무리 클릭해도 웹페이지의 변동이 없습니다.

<a href="http://www.naver.com" onclick="return false">네이버</a>

 

+ 아래코드는 페이지 변동이 있겠습니다.

<a href="http://www.naver.com" onclick="return true">네이버</a>

 

그렇다면 아래의 경우도 예외는 아니겠지요? ^^

<form onsubmit="return false">

<form onsubmit="return true">

 

submit 이벤트가 발생했을 때... onsubmit 속성에 스크립 구문을 실행할 수 있는데...

onsubmit="return checksaveform();

return이 있는 것은 form객체가 submit 이벤트가 발생했을 때...

관련 처리를 하고...

돌려 받는 값이 true 또는 false에 의해 전송을 하던가 중지를 하게 되는 겁니다.

 

onsubmit="checksaveform();" 이러한 경우는..

전송하기 전... checksaveform() 함수만을 수행하겠다는 의미만 되겠습니다.

 

물론, return 구문이 없는 경우더라도, submit에 대한 취소를 못하는 것은 아닙니다만...

비정상적인 접근방법이라....일단 이렇습니다.


출처 - 네이버 지식

'Development > HTML' 카테고리의 다른 글

html - viewport  (0) 2012.05.28
html - defer, async 속성  (0) 2012.05.28
HTML - rel 속성  (0) 2012.05.15
웹페이지를 가운데 정렬 하기  (0) 2012.05.11
테이블을 기준으로 레이어 생성하기  (0) 2012.05.11
Posted by linuxism
,