[html] window.location(); window.open(); 특정 링크로 이동하기

body 부분에 어떤 메뉴 영역 div가 있다.

 

PC버전에서는 hover를 하면 하위 메뉴가 나타나고 태블릿에서는 클릭 이벤트로 바뀌며 모바일 시에는 클릭하면 하위 메뉴 중 최상단의 메뉴 링크로 곧바로 이동함

 

모바일에서만 div에 링크를 걸어야 하는 상황에서 사용한 window.location();

 

1. div 클래스를 link-box라고 가정

2. link-box에 속성으로 <data-url="";> 추가. 따옴표 안에 이동할 링크 주소를 넣어둔다

3-1. 모든 링크가 해당 창에서 링크로 바로 이동하는 경우

      $('.link-box').on('click', function(e){

         var $Link = $(this).data('url');

         window.location.replace($Link);

      });

3-2. 일부 메뉴만 새창이 열리면서 이동하는 경우

     $('.link-box').on('click', function(e){

         var $Link = $(this).data('url');

         if($Link == '새창에서 열릴 첫번째 링크 주소'){

            window.open($Link);

         }else if($Link == '새창에서 열릴 두번째 링크 주소'){

            window.open($Link);

         }else{

            window.open($Link, '_self'); // 나머지 링크는 해당 창에서 바로 열림

      });