Publish/JavaScript

[ jquery ] 특정영역을 제외한 외부영역 클릭 시 팝업창 닫기

아2 2022. 3. 8. 22:28
 // 특정영역 제외한 외부영역 클릭 시 팝업창 닫기
var target = $("특정영역")
$("#wrap").mouseup(function (e){
if(target.has(e.target).length==0) {
    target.addClass("hidden")
} 
});


---> 위 코드 적용 안됨, 아래코드로 해결

// 셀렉트 외부 클릭시 닫힘
const selectTarget = $('.selectbox');
$("body").mouseup(function(e){   
    if(selectTarget.has(e.target).length === 0){
        $('.selectbox').removeClass('on');
    }
});

 

---> 외부영역 닫힘 코드가 여러번 필요할때,

  // 외부 클릭시 
  $("body").mouseup(function (e) {
  
    // 공통 모달
    const selectTarget = $('.modal_wrap');
    if (!$('.modal_wrap').hasClass('hidden')) { //조건
      if (selectTarget.has(e.target).length === 0) {
        //닫히는 스크립트
      }
    }

    // A 페이지
    const selectTarget2 = $('.aside_box');
    if ($('.aside_cont_section').hasClass('bg')) { //조건
      if (selectTarget2.has(e.target).length === 0) {
        //닫히는 스크립트
      }
    }

  });