모달 iframe을 클릭하여 대화 상자를 닫으시겠습니까?

Question

모달 대화 상자를 만듭니다. 먼저 body 태그에 iframe을 추가하여 오버레이로 사용합니다.

<div class="modal-screen"> 
    <iframe src="javascript:false;"></iframe> 
</div> 

그럼 대화 상자를 body에 추가합니다.

<div class="dialog"> 
    <!-- various dialog related elements 
</div> 

이제 사용자가 오버레이를 클릭하면 대화 상자를 닫으려고합니다. 문제는 오버레이와 관련된 이벤트에 바인딩 할 수없는 것입니다. 나는 그것을 필요로 할 때

initialize: function() { 
    this.modal = $('<div class="modal-screen"><iframe src="javascript:false;"></iframe></div>') 

    this.modal.on('click', function(e) { 
    // this event never seems to fire 
    console.log("hello"); 
    } 
} 

가 그럼 난 페이지에 렌더링 :

은 기본적으로 내 대화보기는 오버레이가 준비되어있는 initialize 방법을 가지고, 내 JS를 요약합니다. 내가 오버레이를 클릭하면, 내가 대신 당신이 그것을 아무것도 결합 할 수없는 이유 인 DOM 개체입니다,

render: function() { 
    $('body').append(this.modal); 
    // append other dialog content 
    this 
} 

Answer 1

여기에 iframe을 사용할 이유가 없습니다. overlay div을 작성한 다음 클릭하면 제거하십시오.

Answer 2

this.modal가 하나의 요소되지 않습니다 .. hello을 볼 수 없습니다. 대신 $ ('. modal-screen', this.modal)을 바인딩하십시오.