Al usar jQuery, la configuración de Arrastre en un elemento evita que se dispare el desenfoque al hacer clic en el elemento que se puede arrastrar
Al usar jQuery, cuando establece un evento de desenfoque en un cuadro de texto y establece otro elemento como arrastrable, al hacer clic en el elemento que se puede arrastrar, el evento de desenfoque no se activa en FireFox. IE es un poco mejor, obtienes el evento de desenfoque pero no obtienes el evento de clic en el elemento que se puede arrastrar.
Si no especifica la cancelación: "" en el constructor que se puede arrastrar, el evento de desenfoque se activará, pero el elemento que desea arrastrar no se puede arrastrar.
jQuery v1.3.2 jQuery UI v1.7.2
Las líneas de console.log son para el complemento FireBox de Firefox.
<HTML>
<HEAD>
<TITLE>Blur/Click Workbench</TITLE>
<script src="js/jquery.js" type="text/javascript" ></script>
<script src="js/ui/ui.core.js" type="text/javascript"></script>
<script src="js/ui/ui.draggable.js" type="text/javascript"></script>
<script type="text/javascript">
function blurring() {
console.log('1 - blurring - ' + $( this ).attr('id'));
}
function clicking() {
console.log('2 - clicking - ' + $( this ).attr('id'));
}
$(document).ready(function() {
$( ".draggableTool" ).draggable( { cancel: "" } );
$( '.property' ).blur( blurring );
$( '#labelContainer' ).click( clicking );
});
</script>
</HEAD>
<BODY>
<input type='text' class='property' id='tb1' />
<br />
<input type='text' class='property' id='tb2' />
<br />
<label class='draggableTool' id='labelContainer' style='height:20px;position:absolute;'>
<textarea id='taLabel' style='height:100%;background-color:white;border:1px solid grey;'>Label</textarea>
</label>
</BODY>
</HTML>