a href=# 클릭 시 상단 이동 방지

a href = # 클릭 시 상단 이동 방지

 

탭버튼의 경우 키보드 포커스를 받기 위해 a 태그를 사용하게 되는데, 이를 클릭 하게 될 경우 이벤트 실행 동시에 페이지가 상단으로 올라가서 사용하기 불편해진다. 이를 방지하기 위한 4가지 방법이 있다. 

 

 

방법1 ) 없는 아이디를 하나 링크시켜 준다.

<a href="#undefindid">버튼기능</a>

 

 

방법2 ) void(0) 를 링크시켜 준다.

<a href="javascript:void();">버튼기능</a>

 

 

방법 3) JavaScript 내부에 링크 방지 코드를 삽입한다.

$('.box a').click(function(e){
	e.preventDefault(); // href=# 방지
});

 

 

방법4 ) 이벤트 끝에 return false;를 삽입해준다.

<a href="#" onclidk="function(); return false">버튼기능</a>