js鼠标移动时禁止选中文字

html-css017

js鼠标移动时禁止选中文字,第1张

这是通过CSS样式来实现的禁止用鼠标选择功能:

unselectable为IE准备

onselectstart为Chrome、Safari准备

-moz-user-select是FF的

css

style:html,body{-moz-user-select:

none

-khtml-user-select:

none

user-select:

none}

<div

unselectable="on"

onselectstart="return

false"

style="-moz-user-select:none">

屏蔽选择的样式定义:-moz-user-select属性(只支持ff)。

属性有三个属性值:

1、

none:用none,子元素所有的文字都不能选择,包括input输入框中的文字也不能选择。

2、

-moz-all:子元素所有的文字都可以被选择,但是input输入框中的文字不可以被选择。

3、

-moz-none:子元素所有的文字都不能选择,但是input输入框中的文字除外。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!

使用z-index:来给元素层定位置。\x0d\x0a\x0d\x0aCSS pointer-events\x0d\x0aPointer-events原本来源于SVG,目前在很多浏览器中已经得到体现。不过,要让任何HTML元素生效还得借助于一点点css。该属性称之为pointer-events,基本上可以将它设置为auto,这是正常的行为,而“none”是一个有趣的属性。\x0d\x0a将它应用到一个元素\x0d\x0a如果你已经设置一个元素的css属性为pointer-events: none。它将不会捕获任何click事件,而是让事件穿过该元素到达下面的元素,就像这样:\x0d\x0a \x0d\x0a.overlay { \x0d\x0apointer-events: none\x0d\x0a} \x0d\x0a \x0d\x0a\x0d\x0a浏览器支持\x0d\x0a到目前为止,Firefox 3.6+、Safari 4 和Google Chrome支持Pointer-events。我觉得Opera和IE肯定会尽快赶上,我不知道它们的计划中是否支持它。

onselectstart 这个东东在Firefox/Opera下不生效,而且不被input和textarea标签支持。

1 IE可以使用onselectstart事件来阻止用户选定元素内文本,包在div里面的都不能够被选中,如下

<div onselectstart="return false">

<textarea>

xxx

</textarea>

</div>

2 Firefox中可以使用CSS "-moz-user-select:none"属性来禁止文本选定

3 webkit浏览器可以使用“-khtml-user-select”,当然也可以使用第一种办法