2013-11-22 10 views
5

専用のイベントハンドラを提供できるように、jQuery UIダイアログのclose(x)ボタンに配線する方法はありますか?ダイアログ内に他のボタンもあり、ダイアログが閉じてしまうと、常に「close」と「beforeclose」イベントが発生します。これは望ましくないため、「close」または「beforeclose」イベントを使用すると機能しません。閉じる(x)ボタンから特定のコードを実行する方法が必要です。jQuery UIダイアログのクローズ(x)ボタン用の専用イベントハンドラ

答えて

3

あなたは試みることができる:

$(document).on('click','.ui-dialog-titlebar-close',function(){ 
    //close button clicked 
}); 
1

私の知る限りがそのボタンに直接配線する方法はませんが、あなたはdialogClassを追加し、イベントハンドラを自分で配線することによって、あなたのポップアップに固有の何かを行うことができます知っています:

var dialogClass ="yourPopupTitle"; 

$(document).on('click', '.'+ dialogClass +' .ui-dialog-titlebar-close', function() { 
    handleEvent(); 
}); 

FIDDLE

9

つのイベントは、jQueryのUIウィジェット内の別のイベントにつながるたびに、元のイベントは、常にイベント0に含まれています回避する。この場合、closeコールバックまたはdialogcloseイベントに渡されたイベントオブジェクトを確認し、event.originalEventが存在するかどうかを確認できます。そうであれば、閉じるボタンをクリックすることでダイアログが閉じられたとみなすことができます。これはbeforecloseにも当てはまります。

タイトルバーの閉じるボタンであることを確実に確認したい場合は、event.originalEvent.targetをチェックして、クラスまたはDOMの場所を.closest()で確認してください。あなたはクリックイベントをバインド解除し、それにカスタムハンドラを再バインドする必要があります - 私は、これはあなたが探しているソリューションであると考えていhttp://jsbin.com/ajoheWAB/1/edit

0

は、ここでこの動作を示すjsbinです。

このスレッドは古くなっていますが、私はまだ自分のソリューションを追加して、他の人に恩恵を受けることを期待しています。

var fnCustomerHandler = function() { 
    alert("Here is your custom handler..."); 
}; 

$("#dialog").dialog({ 
     open: function(event, ui) { 
      var el = $(this).closest('.ui-dialog').find('.ui-dialog-titlebar-close'); 
      el.off(); 
      el.on("click", fnCustomerHandler); 
     } 
    } 
); 

フィドルリンク:

http://jsfiddle.net/morefool/n82649d5/

関連する問題