Haga clic fuera del cuadro de diálogo no modal para cerrar

Question

Según mi investigación anterior, he sido capaz de descubrir cómo activar un evento de clic en vivo en la superposición alrededor de un cuadro de diálogo para cerrar el cuadro de diálogo. Sin embargo, eso restringe el desarrollo posterior de esta característica de diálogo a ser modal. Si configuro el diálogo como no modal, no hay superposición para activar el evento click. ¿Cómo puedo configurar el diálogo (que ahora no es modal) para cerrar cuando hago clic fuera de él sin utilizar el evento de clic de superposición?

Aquí es mi diálogo y el evento click en vivo subsecuente que me permite cerrar el diálogo de la superposición:

$("#dialog-search").dialog({ 
    resizable: false, 
    height:dimensionData.height, 
    width: dimensionData.width, 
    modal: false, 
    title: dimensionData.title, 
    position: [x,y], 
    close: function(event, ui){ 
     callBack(event,ui); 
    } 
}); 
$('.ui-widget-overlay').live('click', function() { 
    $('#dialog-search').dialog("close"); 
}); 

Answer 1

finalmente descubrió la respuesta a mi propia pregunta. Al vincular un evento de mousedown al propio documento y luego excluir el diálogo, podemos duplicar la funcionalidad de la función en vivo para superposiciones. Debajo del código he incluido un jsFiddle que demuestra la solución.

// Listen for document click to close non-modal dialog 
$(document).mousedown(function(e) { 
    var clicked = $(e.target); // get the element clicked 
    if (clicked.is('#dlg') || clicked.parents().is('#dlg') || clicked.is('.ui-dialog-titlebar')) { 
     return; // click happened within the dialog, do nothing here 
    } else { // click was outside the dialog, so close it 
     $('#dlg').dialog("close"); 
    } 
}); 

http://jsfiddle.net/elwayman02/Z5KA2/