본문 바로가기

프로그래밍/JavaScript

[JavaScript] onclick에서 return false;의 의미

반응형

 

 

  onclick에서 return false의 의미

 

onclick에서 return false의 의미는 뭘까?

 

먼저 a태그를 클릭하면 href로 이동하는 액션을 취한다.

그러나 a태그에서 onclick 이 있을 경우에는? onclick를 먼저 수행하고 href로 이동하는 액션을 취한다.

그러나 onclick에서 return false가 있을 경우 href로 이동하는 액션을 취하지 않게 된다.

 

 

 

자 그럼 두 경우의 a태그를 살펴보자

 

<a href="#" onclick="alert("hi");">TEST1</a>
<a href="#" onclick="alert("hi"); return false;">TEST2</a>

 

먼저 TEST1를 클릭하면 hi라는 대화상자가 뜨게 되고, 페이지가 상단으로 이동하게 된다.

1. onclick를 수행하며 hi라는 대화상자를 띄운다.

2. href로 이동하는 액션을 취하는데, href="#"로 호출 함수를 숨겨버렸기 때문에 페이지가 이동하지 않게된다.

따라서 갈곳을 잃어버린 브라우저는 페이지의 상단으로 이동해버린다.

 

다음으로 TEST2를 클릭하면 hi라는 대화상자가 뜨고, 이후 페이지의 변화가 없다.

return false로 링크 기능인 href가 수행되지 않았기 때문이다.

 

 

 

반응형