한 번에 jquery-ui 대화 상자를 하나만 닫습니다.

Question

여러 jQuery UI 대화 상자에 문제가 있습니다. 원하는 것은 여러 개의 대화 상자를 가질 수 있으며 ".close-modal"클래스가있는 버튼을 클릭하면 해당 버튼이있는 대화 상자 만 닫힙니다. 이제 약간의 배경에 대해 먼저 : "메인"상위 사이트에 간단한 함수가 있습니다.이 함수는 ".modal"클래스의 링크를 클릭하여 모달 대화 상자를 엽니 다. 부모

function modal(href, title) { 
    var $dialog = $('<div></div>'); 
    $dialog.html('<iframe class="modal" name="' + title + '" style="border: 0px;" src="' + href + '" width="100%" height="100%"></iframe>'); 
    $dialog.dialog({ 
     autoOpen: false, 
     modal: true, 
     height: 650, 
     width: 950, 
     title: title 
    }); 


    $dialog.dialog('open'); 

    $(document).bind('close-dialog', function() { 
     $dialog.dialog('close'); 
    }); 
} 

$('a.modal').click(function(event) { 
    event.preventDefault(); 
    modal($(this).attr('href'), $(this).attr('title')); 
} 

이 코드에서

내가 원하는 방식으로 작동합니다.

그래서에서 대화

(function($) { 
    $(document).ready(function() { 
     $('a.modal').click(function(event) { 
      event.preventDefault(); 
      parent.modal($(this).attr('href'), $(this).attr('title')); 
     } 

     /** Trigger the close-dialog event on the parent to close the current dialog. */ 
     $('.close-dialog').click(function() { 
      parent.jQuery(parent.document).trigger('close-dialog'); 
     }); 
    }); 
})(jQuery); 

에서

: 그 여러 대화 상자가 상위에 표시 될 수 있도록 대화 상자에서 대화 상자를 열려면, 내가 올바른 매개 변수로 부모 윈도우의 모달 함수를 호출 본질; iframe 내에서 $ dialog.dialog ('close')를 호출하는 코드에 의해 호출 될 수있는 부모 창 ("닫기 대화 상자")에 이벤트를 정의했습니다. 이것은 훌륭하게 작동합니다. 대화 상자 내에서도 여러 대화 상자를 만들 수 있지만 문제는 button.close-dialog을 클릭하면 모두 내 대화 상자의을 닫는 것입니다.

이벤트가 호출 된 대화 상자를 확인할 수있는 방법이 있습니까? 또는 현재 대화 상자에 이벤트를 바인딩 하시겠습니까?

Answer 1

jquery 모달의 버튼 옵션을 사용할 수 있습니다.

<script> 
$(function() { 
    $(".myModals").dialog({ 
     modal: true, 
     buttons: { 
      Close: function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 
}); 
</script> 

한 번에 모든 모달에 대해이 작업을 수행해야하며 만드는 버튼은 자신에게만 적용됩니다. 희망이 도움이됩니다!