UI 대화 상자가 열리는 경우 함수 호출

Question

각자 고유의 inits 및 옵션을 가진 10 개의 다른 대화 팝업이 있다고 가정 해 봅니다.

대화 상자가 열려있을 때 함수를 어떻게 호출합니까? 즉, 다음의 올바른 구문 :

$(if("*").dialog("open")) $(// do this); 

Answer 1

당신은 대화가 개방 될 때마다 실행하는 기능을 jQuery를 UI에 의해 방출 된 dialogopen 이벤트를 수신 할 수있다. 예를 들어

:

$(function() { 
 
    $(".dialog").dialog({ 
 
    autoOpen: false 
 
    }); 
 
    $("button").click(function() { 
 
    $(".dialog").dialog("close").eq($(this).index("button")).dialog("open"); 
 
    }); 
 
}); 
 
$(".dialog").on("dialogopen", function() { 
 
    alert("a dialog opened!"); 
 
})

<link href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
 
<button>Open dialog1</button> 
 
<div class="dialog" title="Basic dialog1"> 
 
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> 
 
</div> 
 
<button>Open dialog2</button> 
 
<div class="dialog" title="Basic dialog2"> 
 
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> 
 
</div> 
 
<button>Open dialog2</button> 
 
<div class="dialog" title="Basic dialog3"> 
 
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> 
 
</div>

---

또는 동적으로 생성 된 대화의 경우에 document에 청취자 바인딩 :

$(document).on("dialogopen", function() { 
    alert("a dialog opened!"); 
});