Eu tive o mesmo problema e tentei várias abordagens e nenhuma funcionou para mim.
Solução 1
$('.item').click(function(e)
{
if ( $(this).is('.ui-draggable-dragging') ) return false;
});
não faz nada por mim. O item está sendo clicado depois de arrastado.
Solução 2 (por Tom de Boer)
$('.item').draggable(
{
stop: function(event, ui)
{
$( event.originalEvent.target).one('click', function(e){ e.stopImmediatePropagation(); } );
}
});
Isso funciona bem, mas falha em um caso - quando eu estava indo para tela inteira ao clicar:
var body = $('body')[0];
req = body.requestFullScreen || body.webkitRequestFullScreen || body.mozRequestFullScreen;
req.call(body);
Solução 3 (por Sasha Yanovets)
$('.item').draggable({
start: function(event, ui) {
ui.helper.bind("click.prevent",
function(event) { event.preventDefault(); });
},
stop: function(event, ui) {
setTimeout(function(){ui.helper.unbind("click.prevent");}, 300);
}
})
Isso não funciona para mim.
Solução 4 - a única que funcionou bem
$('.item').draggable(
{
});
$('.item').click(function(e)
{
});
Sim, é isso - a ordem correta faz o truque - primeiro você precisa vincular o evento draggable () e depois click (). Mesmo quando coloquei o código de alternância de tela inteira no evento click (), ele ainda não foi para a tela inteira ao arrastar. Perfeito para mim!