2009-09-15 56 views
0

我正在使用綁定到live()鼠標懸停事件的jQuery可拖放/ droppables。我正在使用,因爲我使用load()來加載頁面,並且需要這些元素在加載後可訪問。在Firefox和Safari中,我收到一個奇怪的行爲,當我最初加載頁面時,只有一些可拖拽區域可以工作。但是一旦放開可拖動的div,然後重新選擇它們,它們會再次神奇地工作。從奇怪的位置拖動拖動div有時會起作用。此外,在初始加載時,所有可投放區域都可以工作,但其中一些區域只有在最初「觸摸」後才能使用。這些最初的激活觸摸通常不是直接在div上,但有時會離開瀏覽器。不管怎麼說,這裏是我的代碼:jQuery中的不可預知的鼠標懸停行爲

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

然後在鏈接的JS文件:

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

如果有人有辦法做到這一點沒有live(),允許抓取load()'頁面中的對象,我願意提供建議。 – Vince 2009-09-15 20:39:22

回答

1

我發現了問題,由於在#的jQuery UI的樂於助人的人。

問題在於事件只是在鼠標懸停時才被綁定,解釋了不規律的行爲。