onselect 与 onselectstart 的区别

onselect 与 onselectstart 都属于 JavaScript 当中的 DOM 事件，由于它们二者的拼写比较相似，所以最初使用时弄混了两个事件的效果，在此做一个简单的记录。

背景

之前在公司的前端项目中，自己写了一个基于 jquery 的分页器，在测试的时候发现了一个问题：当鼠标连续快速点击【下一页】按钮的时候，会将按钮上的文字选中，变成蓝色，体验不是很好。因为当时知道有一个事件是可以控制元素文字是否允许被选中的，但是忘记了怎么用的，于是上网搜索了一番。第一次错将 onselect 事件当成了实现这个效果的事件，试过之后发现不管用，继续研究发现其实应该是用 onselectstart 事件来进行控制。

二者的区别

1. onselect 事件会在文本框中的文本被选中时发生

2. 支持该事件的 HTML 标签：，

3. 支持该事件的 JavaScript 对象：window

4. 使用举例：

即当鼠标的左键划过并选中了 input 输入框中的内容时，就会触发 onselect 事件。

1. onselectstart 触发时间为目标对象被开始选中时（即选中动作刚开始，尚未实质性被选中）

2. onselectstart 几乎可以用于所有对象

3. 注意：onselectstart 事件不被 input 和 textarea 标签支持

4. 使用举例（非 Firefox 浏览器下）：

我不能被鼠标选中哦

1. Firefox 不支持上面这样的使用方式，在 Firefox 浏览器下可以通过设置 CSS 样式来达到相同的效果

div { -moz-user-select: none; }

即 onselectstart 事件才是用来实现元素内文本不被选中的正确方法。

关键字：JavaScript, html, 选中, onselect

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！