当我单击画布并拖动鼠标时,光标将变为文本选择光标。我怎么能阻止这个?

时间:2012-08-04 01:54:51

标签: javascript css google-chrome mouse-cursor

这是一个小提琴:http://jsfiddle.net/MZ9Xm/

注意:以下内容适用于Chrome 22.0.1221.1,但不适用于Firefox 14.0.1。 [Ubuntu linux]

将鼠标移动到顶部画布,然后按住鼠标按钮。拖动鼠标,光标将变为文本选择鼠标光标(I-bar)。如果页面上没有其他元素,则不会发生这种情况。

我把用户选择设置为无,但是没有任何运气。

3 个答案:

答案 0 :(得分:24)

您可以在画布中绑定mousedown事件以防止默认行为。

类似的东西:

// with jQuery
$( "#canvasId" ).mousedown(function(event){
    event.preventDefault();
});

// without jQuery
document.getElementById( "canvasId" ).onmousedown = function(event){
    event.preventDefault();
};

这是更新的小提琴:http://jsfiddle.net/MZ9Xm/1/

您需要对此进行测试,看看您的工作是否有一些副作用。

答案 1 :(得分:3)

您是否尝试过使用CSS cursor property

canvas {
    cursor: pointer;
}

它应该显示默认光标。

答案 2 :(得分:1)

试试这个:

var canvasEls = document.getElementsByTagName('canvas'),
    preventHl = function () { return false; },
    i = 0;

while (i < canvasEls.length) {
    canvasEls[i].onmousedown = preventHl;
    i += 1;
}

返回false将阻止突出显示等默认操作。