2013-11-22 30 views
5

'da yakın (x) düğmesi için özel olay işleyicisi Özel bir olay işleyicisi sağlayabilmeniz için bir jQuery UI iletişim kutusundaki kapat (x) düğmesine bağlanmanın bir yolu var mı? "Kapat" veya "beforeclose" olayını kullanma, iletişim kutusundaki iletişim kutusunun kapanmasına neden olan başka düğmeler varsa, her zaman "yakın" ve "beforeclose" olaylarını vurmaya devam edeceğiniz için işe yaramaz. . Belirli bir kodu yakın (x) düğmesinden çalıştırmak için bir yol istiyorum.jQuery UI iletişim kutusu

cevap

3

Sen deneyebilirsiniz:

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

Bildiğim kadarıyla orada o düğmeye doğrudan tel yolu yok, ama bir dialogClass ekleyerek ve bir olay işleyicisi kendiniz kablolama ederek Popup özgü bir şey yapabilirsiniz bildiği gibi:

var dialogClass ="yourPopupTitle"; 

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

FIDDLE

9

bir olay bir jQuery UI Widget içinde başka etkinlikle sonuçlanırsa zaman, orijinal olay hep olay o dahildir Nesne. Bu durumda, close geri arama veya dialogclose olayına iletilen olay nesnesine bakabilirsiniz ve event.originalEvent olup olmadığını kontrol edebilirsiniz. Eğer öyleyse, iletişim kutusunun kapat düğmesine bir tıklamayla kapatıldığını varsayabilirsiniz. Bu, beforeclose için de geçerlidir.

Başlık çubuğunda kapat düğmesi olduğundan kesinlikle emin olmak isterseniz, event.originalEvent.target numaralı telefonu kontrol edebilir ve ya sınıfı veya DOM konumunu .closest() kullanarak kontrol edebilirsiniz. Eğer tıklama etkinliğini unbind ve ona özel işleyicisi yeniden bağlamak gerekecektir - Bunun aradığınız çözüm olduğuna inanıyoruz http://jsbin.com/ajoheWAB/1/edit

0

:

Burada eylem bu gösteren bir jsbin bu.

Bu iş parçacığı eski olmasına rağmen, yine de çözümümüzü, arama yapan diğer kişilerden yararlanma umuduyla eklerim.

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); 
     } 
    } 
); 

Fiddle linki:

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

İlgili konular