1

这是一个简单的jsFiddle：

我有一个span我绑定的元素mouseover。当我在不同的文本行上水平移动鼠标时，鼠标悬停只发生一次。但是，当我在同一个 span 元素内的文本行之间移动时，鼠标悬停会发生多次。

  • 这是预期的吗？
  • 是否有防止这种情况的标准方法（缺少添加逻辑来考虑最后访问的元素）？

使用 Chromium，版本 28.0.1500.71 Ubuntu 13.04 (28.0.1500.71-0ubuntu1.13.04.1)。

4

4 回答 4

1

这似乎源于<span>具有多行文本的内联元素。实际上，就鼠标而言，每行之间的空间不包含在元素中。

这可以通过在元素上放置背景颜色来看到。将其更改为 css 中的 block 元素可以display:block缓解问题，或者使用 span 以外的其他本机块元素

Background demo

于 2013-11-11T03:02:59.113 回答
1

如果您将其设为 div 而不是跨度，它将按预期工作

于 2013-11-11T02:20:27.070 回答
1

这是 a 的奇怪用法span。由于语义元素是一个<p>标签，所以使用它。这也将纠正您的问题。

于 2013-11-11T02:21:06.057 回答
1

有趣的是，这是因为 span 是一个内联元素并且它是包装的。因为 span 是一个内联项，并且它是换行的，所以你会得到单独的行，并且行之间有空格。我以前从未接受过这个，但是，因为你有一个 mouseout 事件，它使它更明显。为了证明这一点，请在您的小提琴上查看此更新。

小提琴：http: //jsfiddle.net/LSRvn/

The reason a DIV doesn't do this is because the DIV is a block element containing the items.
于 2013-11-11T02:32:09.987 回答