在单元格之间移动时悬停在表格行触发上

Question

我注意到 Chrome 15 和 Safari 中关于 tablerow 上的 jquery 悬停事件的一些奇怪行为。

当我将鼠标从一个单元格移动到下一个单元格时（在同一行中），chrome 正在触发关闭/开启事件。由于悬停附加到表格行，我希望开/关事件仅在开/关行时触发。

请看我的JSFiddle。

在示例中，将鼠标移动到一个单元格结束和另一个单元格开始的位置（颜色发生变化的位置）。

这些事件似乎在 IE 和 Firefox 中正确触发，但在 Safari 和 Chrome 中却没有。也许这是 webkit 中的一个错误？

Answer 1

我绝对认为这是 webkit 的问题（有道理，因为它既是 chrome 又是 safari）。

我认为我有一个可能的解决方法，但有一些连锁反应：

更改 td 的 css：

td {
    background-color: #e0dffe;
    border: none;
    padding: 10px;
    position:relative;
    left:-1px;
}

这具有将每个 td 元素向左推 1 个像素的效果，移除 webkit 似乎插入的额外 1 个像素。正如您将看到的那样，这会导致您的边界出现问题，因此您需要使用 td:first-child、td:last-child css 才能在所有浏览器中获得所需的内容。我看不出一个简单的答案。