10

我正面临拖放问题。

我希望始终看到正在拖动的元素，并且希望能够滚动特定的 div 以将元素拖放到表格的任何单元格中。我还希望能够将元素从任何 div 拖动到任何 div。

这个例子几乎可以正常工作。我的最后一个问题是关于单元格hoverClass属性：当我从靠近“容器 B”边界的“容器 A”中拖动一个元素时，我实现了一个自动滚动行为来在我的表格中导航以到达任何单元格。但是，在滚动模拟之后，hoverClass不适用于右侧单元格。但是，元素总是被放入正确的单元格中。

https://jsfiddle.net/Bouillou/QvRjL/434/

我的方法正确吗？

编辑

我找到了解决方法。这个想法是在帮助器构造回调期间将元素克隆附加到可滚动容器，然后在 1ms 后使用 setTimeout 函数将帮助器附加到主体。辅助位置必须映射到鼠标位置以避免偏移问题。

这是我的最终解决方案：https ://jsfiddle.net/Bouillou/QvRjL/434/

我确信有可能开发出一种最好的方法来做到这一点。

4

2 回答 2

5

显然我的更新是唯一的解决方案。

它现在可以工作几个月没有问题。

我找到了解决方法。这个想法是在帮助器构造回调期间将元素克隆附加到可滚动容器，然后在 1ms 后使用 setTimeout 函数将帮助器附加到主体。辅助位置必须映射到鼠标位置以避免偏移问题。

这是我的解决方案：http: //jsfiddle.net/QvRjL/134/

$('[id^="drag-"]').each(function() {
    $(this).draggable({
        opacity: 0.7,
        cursorAt: { top: 15, left: 50 },
        appendTo: 'body',
        containment: 'body',        
        scroll: true,
        helper: function(){ 
            //Hack to append the cartridge to the body (visible above others divs), 
            //but still bellonging to the scrollable container  
            $('#container').append('<div id="clone" class="cartridge">' + $(this).html() + '</div>');   
            $("#clone").hide();
            setTimeout(function(){
                $('#clone').appendTo('body'); 
                $("#clone").show();
            },1);
            return $("#clone");
        }    
    });
});​
于 2012-12-25T08:36:44.030 回答
0

如果我理解正确，滚动后，highlitedcells 不是正确的..

在我看来，它计算单元格以从您的容器元素中突出显示，然后在表格元素内复制 de 位置。

基本上，它检查鼠标从“container2”的偏移量，然后突出显示偏移量处的单元格，但从表格“t”位置开始。

抓住机会并使用位置而不是偏移量。并在http://api.jquery.com/offset/上提到，

.offset() 方法允许我们检索元素相对于文档的当前位置。将此与 .position() 进行对比，后者检索相对于偏移父级的当前位置。

Personnaly 我会简单地将 css 类应用于单元格并使用 css:hover。/编辑：如果您需要这样做的唯一原因是突出显示单元格..也许您也想触发其他一些东西。

于 2012-10-19T21:35:19.843 回答