html里双击一个li，然后系统会自动选择到周边的文字

Question

如图，html结构其实就是li的float:left;
主要问题就是我双击红框里的文字，系统会自动选择到peter和2014，导致我右键点击复制时，会把peter和2014这不相干的文字一起加入到剪贴板。
这个问题该怎么解决呢？
我只想双击时，只选择红框的区域额

Answer 1

这个问题确实蛋疼，参照 不同CSS布局实现与文字鼠标选择的可用性 简单使用浮动布局实现了下，楼主在不同浏览器点击查看演示。

Answer 2

需要阻止事件冒泡：

JQuery 提供了两种方式来阻止事件冒泡。

用这样event.stopPropagation();或者return false;

    $("#div1").mousedown(function(event){
        event.stopPropagation();
    });

    $("#div1").mousedown(function(event){
        return false;
    });

注意：return false 会阻止事件本身。

Answer 3

你可以给要复制的元素添加属性contenteditable为true.这种效果在github上有很多范例。
Ps：复制可以不用手动复制，可以选择使用第三方库或者flash实现；但是鉴于你的列表项目多，还是用手动复制吧= =！ 产生flash object非常耗内存

Answer 4

能否把代码（包括css）贴一下？
可能是标签本身或者css引起的。

Answer 5

设置 overflow:hidden;

Answer 6

我觉得如果是高级的浏览器是不是可以设置两边的文本属性-webkit-user-select: none;