13

我没有在 DocType 上发布这个，因为它不是一个真正的design东西，视觉表示不是我的问题，行为是。如果放错了地方，我很抱歉，但我不认为这是设计师的问题。

以下 DOM：

<ul style="overflow: hidden;">
   <li style="float: left;"><strong>SKU:</strong>123123</li>
   <li style="float: left;"><strong>ILC:</strong>asdasdasdasd</li>
</ul>

或者

<div style="overflow: hidden;">
   <div style="float: left; width: 49%"><strong>SKU:</strong>123123</div>
   <div style="margin-left: 50%; width: auto;"><strong>ILC:</strong>asdasdasdasd</div>
</div>

或者

<p>
   <span><strong>SKU:</strong>123123</span>
   <span><strong>ILC:</strong>asdasdasdasd</span>
</p>

都给我一个奇怪的问题

  • 即 6
  • 即 7
  • 火狐 3.x
  • 铬合金

但不在

  • 即 8

当您在“SKU:”之后双击“123123”时，它会从下一个 dom 元素中选择“123123”和“ILC:”。

获取此页面上的任何文本（此处为 SO），双击一个单词，它只选择THAT WORD，即使在段落中间。这些例子有 dom 元素关闭它们，任何人都知道为什么会这样。

我的同事使用“双击”机制来选择相关的产品 ID 来完成他们的工作，这对我来说没有任何意义。

4

3 回答 3

16

我有同样的问题。如果您在 li 的结束标记之前放置一个空格，则应该修复它。

<ul style="overflow: hidden;">
    <li style="float: left;"><strong>SKU:</strong>123123 </li>
    <li style="float: left;"><strong>ILC:</strong>asdasdasdasd </li>
</ul>
于 2013-10-29T20:45:50.820 回答
4

如果您在每个 之间放置一个不间断空格 (&nbsp;或\u00A0) 或只是一个空格 ( " ") span，它将分隔单词并防止双击选择溢出到相邻的跨度中。

如果您不想看到可见空间，请使用零宽度空间（&ZeroWidthSpace;或\u200B）。​​​​</p>

于 2020-04-24T11:53:31.500 回答
2

我怀疑如果您&nbsp在两个元素之间包含一个空格或不间断空格，您会发现您可以双击，然后只选择一个而不是两个元素，因为浏览器将不再将这两个元素视为一个字。

于 2010-05-20T17:53:45.627 回答