Chrome 错误？鼠标按下时光标发生变化 +移动

Question

在 Chrome 中（我在 Win 7 上使用版本 16.0.912.75 m），我发现无论我将光标设置为什么，只要我按住鼠标左键并移动光标，光标类型就会更改为 < code>text（即使页面上没有任何文本）。

这是一个错误吗？有谁知道如何解决它，因为它使我的拖放工具看起来有点傻！

div {
    background-color: lime;
    height: 100px;
    width: 300px;
    cursor: wait;
}

<div></div>

原始JSFiddle：http://jsfiddle.net/KJfbs/

编辑

正如下面@davgothic 所回答的，添加 -webkit-user-select: none; 将解决没有文本时的问题。但是，如果我们绝对定位该元素并将文本放在其后面，那么问题仍然存在。

div {
    background-color: lime;
    height: 100px;
    width: 300px;
    cursor: wait;
    -webkit-user-select: none;
    position: absolute;
    top: 0;
    left: 0;
}

<div></div>
<p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc quis eros mi, non tristique diam. Cras auctor posuere urna, porta egestas metus sollicitudin at. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer id arcu quis ipsum feugiat consequat id sit amet velit. Vivamus at quam quis lacus pellentesque egestas eu sed nulla. Vestibulum arcu augue, ultrices quis lobortis vehicula, molestie ut velit. Donec egestas lacus id diam euismod a lacinia lorem ultrices.

Vivamus non mi nunc. Pellentesque vitae sodales magna. In ac urna tortor. Quisque mattis mollis magna ultricies pellentesque. Mauris sed lorem eget sem imperdiet volutpat. Fusce fringilla pretium enim, eu ultricies justo fringilla in. Aliquam ac dui risus, ut eleifend tellus.

Nulla facilisi. Fusce nec leo lectus, in porttitor est. Etiam in posuere tellus. Maecenas viverra nibh et odio aliquam at aliquet arcu ultricies. Aliquam in arcu ac mi mollis ultricies vitae dapibus risus. Integer a arcu eu ipsum fermentum dignissim a vitae nunc. Pellentesque consectetur rutrum metus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Morbi semper dapibus nunc. Mauris congue est sit amet neque condimentum nec fermentum massa sagittis. In bibendum cursus tortor quis scelerisque. Mauris est nisi, elementum eu scelerisque vel, placerat quis erat. Nam malesuada massa quis sem eleifend tempor eget ut erat.

Etiam egestas ligula nec odio molestie placerat. Donec nunc dolor, venenatis id iaculis vel, dapibus quis justo. Suspendisse sed nunc eget nunc luctus hendrerit eget at tortor. Quisque consectetur, eros eget dictum lobortis, erat nisl eleifend metus, egestas vulputate purus urna ut arcu. Nunc mollis tempor mi, quis commodo diam semper id. Nulla sed urna sit amet tellus consequat elementum. Maecenas cursus ipsum sit amet nunc laoreet quis placerat urna tempor. Maecenas tristique sodales posuere. Mauris scelerisque ornare tincidunt. Nulla tempus gravida orci, vel lacinia ante placerat ac. Donec gravida erat vitae elit suscipit ac ullamcorper lacus faucibus.

Aenean dictum elit eu nunc varius suscipit. Praesent ultrices, nunc ullamcorper posuere consectetur, purus ipsum dictum nisl, ultrices rhoncus nisl mauris sit amet dui. Donec convallis arcu eu nibh laoreet pulvinar. Sed euismod volutpat nibh eget faucibus. Maecenas interdum dapibus consequat. Sed sit amet leo lectus, euismod molestie nunc. Donec dui tellus, dignissim ut luctus non, facilisis eu magna. Phasellus a neque et dui luctus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec volutpat mollis dui, eget varius nunc gravida eu. Vivamus nibh erat, dapibus eu mattis blandit, sodales ut nisi. Vivamus pellentesque congue placerat. Pellentesque ultricies turpis vel odio imperdiet et facilisis leo viverra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Lorem ipsum dolor sit amet, consectetur adipiscing elit.    
</p>

原始JSFiddle：http://jsfiddle.net/KJfbs/2/

Answer 1

尝试将 -webkit-user-select: none; 添加到该元素的 CSS 以防止文本选择。

示例： http://jsfiddle.net/KJfbs/1/

就我个人而言，我也会添加这些.. ...

-webkit-user-select: none;
 -khtml-user-select: none;
   -moz-user-select: none;
    -ms-user-select: none;
     -o-user-select: none;
        user-select: none;

为了跨浏览器兼容性。

Answer 2

我认为使用 -webkit-user-select: none;如果您在页面中添加其他内容，问题仍然存在。例如： http://jsfiddle.net/KJfbs/237/

无论如何，我认为 jQuery PreventDefault 解决了任何情况下的问题：
http://jsfiddle.net/KJfbs/241/

PreventDefault 避免更改为光标的默认行为文本。
然后我可以控制并放置我想要的任何光标： $(this).css("cursor","wait");

JQUERY:

$(function(){
    $('#lime').mousedown(function(e) {
        e.preventDefault();
        $(this).css("cursor","wait"); 
    }).on('mouseup mouseleave', function() {
        $(this).css("cursor","default");
    }); 
});

HTML:

<div id="lime"></div>
<p>Lorem ipsum dolor sit amet</p>

CSS:

#lime {
    background-color: lime;
    height: 100px; width: 300px;
    cursor: wait;
    position: absolute;
    top: 0; left: 0;
}