모달 문제 닫기

Question

모달을 여는 데 다음 코드를 사용하고 있습니다.

모달이 예상대로 열리고 - 부모 클래스에 open을 추가합니다. 그러나 '닫기'를 클릭하면 닫히지 않습니다. & close은 수업에 추가되지 않습니다.

누군가 설명 할 수 있습니까?

<script type="text/javascript"> 
jQuery(document).ready(function($) { 

    $window = $(window) 

    $(".modal-trigger").click(function(e) { 
     e.preventDefault() 

     var id = $(e.target).attr("href") 

     $(id).addClass("open") 

     $(id).find('.close').click(function(e) { 
      e.preventDefault() 
      $(e.target).parent().removeClass(".open") 
     }); 

    }) 

}); 

</script> 

내 Close 버튼 HTML : <button class="close icon-close"></button>

Answer 1

내가 parent() 당신이 수준을 해결하기 위해 제공합니다 생각하지 않습니다. 대신 즉 $(id), 당신이 처음에이 클래스를 추가 요소에서 .open 클래스를 제거하려고 :

$(".modal-trigger").click(function(e) { 
    e.preventDefault(); 

    var id = $(e.target).attr("href"); 
    $(id).addClass("open"); 

    $(id).find('.close').click(function(e) { 
     e.preventDefault(); 
     $(id).removeClass("open"); 
     $(this).off(); 
    }); 
}); 

는 또한 당신은 아마 닫기 버튼의 클릭 이벤트 바인딩을 해제하려면, 그렇지 않으면 여러 번 바인딩합니다.