jQuery UI拖放：目標拾取不正確的可投放區域

儘管有大量的Google搜索，但我一直在爲這種奇怪的行爲而撕裂我的頭髮！jQuery UI拖放：目標拾取不正確的可投放區域

我已經創建了一個可拖動的div元素，以及一系列應該在懸停時突出顯示的可放置div。當我點擊並拖動時，我的助手的行爲如預期的那樣，但是我的可放置的div不會......鼠標右側一半屏幕上的可放置元素是突出顯示的元素，這與y軸看起來特別奇怪似乎正常工作。這裏是我試圖做的簡化和匿名小提琴顯示的行爲：Fiddle

我相信它可能與我使用appendTo在可拖動函數，我想繼續移動我的項目跨越divs。這是我出錯的地方嗎？

我的很多Google搜索結果都發現人們在頁面上滾動頁面，但在這裏我沒有任何x軸滾動。

下面是這也是在小提琴代碼：

var bucket_string = "#Bucket1"; 
 
var div_defect = document.createElement("div"); 
 
div_defect.className = "item"; 
 
div_defect.innerHTML = "Item 1"; 
 
$(bucket_string).append(div_defect); 
 

 
$('.item').draggable({ 
 
    appendTo: '#workspace', 
 
    helper: 'clone', 
 
    cursor: 'move', 
 
    revert: true, 
 
}); 
 

 

 
    $('.item').bind("drag", function (event, ui) { 
 
     var width = $('.item').width(); 
 
     ui.helper.css("width", width); 
 
     ui.helper.css("font-size", "x-small"); 
 
    }); 
 

 
    $('.Bucket').droppable({ 
 
     accept: '.item', 
 
     hoverClass: 'hovered', 
 
    })

來源

2014-09-24 Tim Hirst

最後的工作了！

發生這種情況是因爲（按照小提琴發佈）我的CSS設置我的可拖動項目的寬度爲其父母的100％。當我在克隆上使用appendTo: '#workspace'時，他們繼承了整個工作空間的寬度，暫時將其位置放出一半的屏幕。

不知道這是我的無能還是特製的「功能」，但將項目的寬度設置爲像素的絕對數量。

來源

2014-09-26 09:12:09

將可拖動項目的寬度設置爲定義的px（像素）而不是％（百分比）

來源

2015-04-02 09:08:40

jQuery UI拖放：目標拾取不正確的可投放區域

回答

相關問題