출처 : http://pdw213.egloos.com/3493140
* a tag안에 페이지 이동을 선언했는데.. 호출된 confirm/prompt 수행결과에 따라 페이지 이동 조건을 걸고 싶었다..
* 참이면 이동 O , 거짓이면 이동 X.. 떡하니.. 대신 고민해주셨다 아주 예전에... 대단하다고 느꼈다.. (나만.. 그런거지?)
* 혹시 주인장분이 문 닫을까봐 본문 아래로 퍼옵니다.
* 감사합니다.
a태그에서의 onclick 이벤트의 이용법
프로젝트를 하면서
<a href=""></a>의 새로운 이용법을 알게 되었다.
어쩌면 다 알고 있는 것일 수도 있지만
난 2년이 넘도록 프로그램쪽에 일을 해왔지만
이번 경우는 처음으로 알게되었다.
기본적으로 a태그의 사용은
<a href="URL">이동</a>
이렇게 사용을 한다.
이럴 경우 클릭시 해당 URL로 이동하게된다.
그럼 다음의 경우
<a href="#" onclick="location.href='URL'">이동</a>
이럴 경우도 클릭하면 해당URL로 이동하게 된다.
게시판의 글 삭제 프로세스의 경우 우선 삭제전 보통 "삭제하시겠습니까?" 라는 확인 작업을한다.
이때 a태그와 자바스크립트를 쓰는데
<a href="#" onclick="delchk();">삭제하기</a>
<script type="text/javascript">
function delchk(){
if(confirm("삭제하시겠습니까?")){
location.href = "write_del_ok.jsp?num=1";
return true;
} else {
return false;
}
}
</script>
이렇게 사용하게된다.
위의 경우 처럼 하게 될 경우 #은 최상위 루트를 가리켜 페이지가 없거나 아님 index.jsp같은 페이지를 보여주게 된다.
그래서 여러가지로 실험해본 결과 form 태그의 onsubmit() 같은 기능이 onclick 이벤트에도 있다는 생각이 들었다.
<a href="write_del_ok.jsp?num=1" onclick="return delchk();">삭제하기</a>
<script type="text/javascript">
function delchk(){
return confirm("삭제하시겠습니까?");
}
</script>
위와 같이 코딩할 경우 삭제하기 를 클릭시 먼저 실행되는 것이 onclick이벤트 이다. 여기서 지정된 함수를 호출한다.
그후 return delchk() 부분에서 delchk()의 리턴값이 true이면 href로 연결된 링크로 이동하고 false이면 이동을 하지
않는다.