Comportement mouseover non prédictible dans jQuery

Question

J'utilise jQuery draggables/droppables liés à un événement mouseover live(). J'utilise live car j'utilise load() pour charger une page, et j'ai besoin de ces éléments accessibles après le chargement. Dans Firefox et Safari, je reçois un comportement étrange où lorsque je charge la page initialement, seules certaines des zones de dépôt fonctionnent. Mais en lâchant le div draggable, puis en le resélectionnant, ils fonctionnent magiquement à nouveau. Faire glisser la div glisser à partir d'endroits étranges fonctionne parfois. De plus, lors du chargement initial, toutes les zones de déversement fonctionneront, mais certaines d'entre elles seulement après avoir été "touchées" au départ. Ces touches d'activation initiales ne sont souvent pas directement sur la div, mais parfois sur le côté du navigateur. Quoi qu'il en soit, voici mon code:

$(document).ready(function() { 

    // Load main report object 
    function reload_report() { 
    $('#report').load('{% url timetracker.views.project_report report_id=report_meta.id %}'); 
    } 

    reload_report(); 

    // Binding dragging events 
    $('.worklog-row').live('mouseover', function() { 
     drag_worklogs(this); 
     return false; 
    }); 

    // Binding dropping events 
    $('.dropTarget').live('mouseover', function() { 
     drop_worklogs(this, '{% url timetracker.views.move_worklogs report_id=report_meta.id %}', 'drop-hover', reload_report); 
    }); 

Puis dans le fichier JS lié:

function drop_worklogs($this, post_url, hover_class, callback) { 
    $($this).droppable({ 
     tolerance: 'pointer', 
     hoverClass: hover_class, 
     drop: function(event, ui) { 
    // Get ids of dropped worklogs 
    var worklogs = []; 
    ui.helper.children().each(function() { 
     var id = this.id; 
     id = id.split('-')[1]; 
     worklogs.push(id); 
     }); 
    var groupStr = $($this).attr('id'); 

    var typeStr; 

    typeStr = groupStr.split('-')[0]; 
    groupStr = groupStr.split('-')[1]; 

    var requestArr = { 
     worklogs: worklogs, 
     group: groupStr, 
     type: typeStr 
    }; 

    var requestData = JSON.stringify(requestArr); 
    //alert(requestData); 

    // Send to server via POST request 
    var success = false; 
    $.post(post_url, { move: requestData }, function() {}, "json"); 
    callback(); 

     } 
     }); 
} 

function drag_worklogs($this) { 
    // Drag and drop 
    $($this).draggable({ 
    helper:function() { 
     var selected = $('input:checked').parents('tr'); 
     if (selected.length === 0) { 
    selected = $($this); 
     } 
    var container = $('<div/>').attr('id', 'draggingContainer'); 
    container.append(selected.clone()); 
    return container; 
     } 
     }); 

Answer 1

Je trouve les problème grâce aux gens utiles sur # jquery-ui.

Le problème est que l'événement est lié uniquement à la souris, ce qui explique le comportement erratique.