jQuery 대화 상자에서 단추 변경

Question

제목 표시 줄의 기본 닫기 단추를 제거하고 다른 것과 기능을 변경하려면 적절한 방법이 있으면 궁금합니다. 나는 클래스를 변경할 수 있지만, close 함수는 제목 표시 줄의 어떤 것보다 우선합니다. 변경 클래스

내 현재 코드 :

var closeButton = $("#dialog").parent().find('.ui-dialog-titlebar a'); 
closeButton.attr("class","ui-dialog-titlebar-lock"); 
closeButton.find("span").attr("class","ui-icon ui-icon-lock"); 

제목 표시 줄의 HTML 코드 : 이전 자바 스크립트 코드의 결과

<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" unselectable="on" style="-moz-user-select: none;"> 
    <span id="ui-dialog-title-profile-dialog" class="ui-dialog-title" unselectable="on" style="-moz-user-select: none;">Edit My Profile</span> 
    <a class="ui-dialog-titlebar-close ui-corner-all" href="#" role="button" unselectable="on" style="-moz-user-select: none;"> 
     <span class="ui-icon ui-icon-closethick" unselectable="on" style="-moz-user-select: none;">close</span> 
    </a> 
</div> 

, 클래스가 오버라이드 (override)되어 있지만, 기능이 남아있다. jQuery 내부 코드 때문입니다. 그렇죠? 어떤 조언을 쉽게 극복하는 방법?

Answer 1

닫기 함수가 남아 있다고 가정합니다.

당신이 할 수있는 일은 이전 클릭 이벤트를 지속 한 다음 바인딩 해제하고 내부적으로 이전 클릭을 호출하여 대화 상자를 실제로 닫는 것입니다.

//persist old click 
var oldClickFn = closeButton.click; 

closeButton.unbind('click').click(function(){ 
    //functionality you want 

    //call the persisted click 
    oldClickFn && oldClickFn() 
}); 

Answer 2

다음 작업을해야합니다 :

var dialog = // here open the dialog and assign it to the dialog variable 
dialog.parent(".ui-dialog").find(".ui-dialog-titlebar-close").unbind('click');   
dialog.parent(".ui-dialog").find(".ui-dialog-titlebar-close").show(); 
dialog.parent(".ui-dialog").find(".ui-dialog-titlebar-close").bind('click', function() { showNoteDialogClose(null, null) }); 


function showNoteDialogClose(data, args) 
{ 
///////// 
}