Question

我没有在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>

所有人都向我提出了一个奇怪的问题

IE 6
IE 7
Firefox 3.x
铬

但不在

IE 8

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

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

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

Answer 1

我遇到了同样的问题。如果你在li的结束标记之前放置一个空格来修复它。

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

Answer 2

我怀疑如果在两个元素之间包含空格或不间断空格&nbsp，您会发现可以双击，并且只选择一个但不能同时选择两个元素，因为浏览器将不再将这两个元素看作一个单词。

Answer 3

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

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

HTML双击选择奇数

3 个答案: