如何禁用 html5 canvas 元素的选择
我监听 html5 画布内的点击事件，它工作得很好。但是，当我单击图像上的任意位置时，浏览器会突出显示该图像，就好像它已被选中一样（类似于在页面上单击时图像可能会突出显示的方式）。我很好奇是否有人知道如何禁用选择 html 元素（例如画布）。我不希望有人单击画布时显示出轮廓。
I listen for click events inside an html5 canvas and it works just fine. However, when I click anywhere on the image the browser highlights it as if it were selected (similar to how an image might look highlighted if clicked on a page). I was curious if anyone knew how to disable selecting of html elements such as canvas. I don't want the canvas to appear outlined when someone clicks it.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
继续 bebraw，使用 CSS 样式并将其添加到头部：
Going on bebraw, go wild with CSS styles and add this in the head:
您可以尝试应用一些 CSS 规则：
正如 Michael 提到的，jQuery 的disableTextSelect 值得一试。即使您最终没有使用它，研究源代码也可能会提供一些见解。
You could try applying a few CSS rules along these:
As Michael mentioned jQuery's disableTextSelect is worth checking out. Even if you don't end up using it, studying the source might give some insight.
似乎只有最后一个 CSS 规则可以做到这一点。在我添加最后一个规则之前，其他规则一起不起作用（在 Safari iOS5 上）。
Only the last of those css rules seemed to do it. The other rules together didn't work (on Safari iOS5) until I added the last one.
我会使用 jQuery.
$('.noSelect').disableTextSelect();< /代码>I'd use jQuery.
$('.noSelect').disableTextSelect();有点相关：如果问题是光标变成选择图标（例如，在画布上拖动时），您可以通过画布上的 CSS 来禁用它：
或阻止事件在 mousedown 处理程序中的默认行为：
Somewhat related: if the problem is that the cursor becomes the selection icon (eg. when dragging on the canvas), you can disable that by either this CSS on the canvas:
or preventing the event's default behavior in the mousedown handler: