1

我有一个问题要问你们当中的 jQuery 大师。

设想

我正在构建一个网络应用程序，它（除其他外）允许用户在大桌子内对卡片进行排序。该表的一个特点是一个固定在表顶部的 bin，但同时“固定”到行上。它允许用户将卡片放置在与列关联但不与行关联的箱中。

这是一个精简的 jsFiddle 示例（制作起来很痛苦），向您展示我的意思。

问题

问题是，如果您在表格中向下滚动一条路径，然后尝试将一张卡片从表格拖到垃圾箱中，它通常不起作用。取而代之的是，卡片被放置在用户看不到的垃圾箱“后面”的表格单元格中。希望这是有道理的。

问题和攻击计划

我认为解决此问题的最佳方法是在用户将鼠标悬停在 bin 上时以某种方式禁用除 bin 之外的所有表中的单元格。这样卡片就一定会落在垃圾箱中，而不是在垃圾箱后面的表格单元格中。

你同意？有没有更好的方法来解决这个问题？

笔记

您可能会看到我的实现，并想知道为什么我要按照我的方式实现。（例如为什么我在 bin、顶行和左列中使用表格单元而不是 div。）不幸的是，我无法完全解释为什么我选择了我所做的实现，但我意识到我是在一个此示例未显示的约束数量。所以......我愿意接受有关如何改进布局的建议，但请不要用“好吧，你为什么不设置这个'这个'方式而不是这样你就不会有处理这个问题，因为你建议的设置很可能由于某种原因对我不起作用。

如果我需要澄清任何事情，请告诉我。非常感谢任何回答的人！

4

1 回答 1

1

这会做（小提琴）：

$('#binRow').mouseenter(function() {
    $('tr:not("#binRow") td.card-holder')
        .removeClass('card-holder')
        .addClass('disabled-card-holder');
}).mouseleave(function() {
    $('.disabled-card-holder')
        .removeClass('disabled-card-holder')
        .addClass('card-holder');
});​
于 2012-07-25T19:41:36.623 回答