1. 程式人生 > >js或css指定元素點擊時內容不可被選中

js或css指定元素點擊時內容不可被選中

指定元素 art class family adding input tro hover ria

一、css3中可以使用"user-select"屬性

body{

-webkit-user-select:none;/*谷歌 /Chrome*/

-moz-user-select:none; /*火狐/Firefox*/

-ms-user-select:none; /*IE 10+*/

user-select:none;

}

user-select:auto:默認,可以選中; none:不可選;text:只可選文本;all:父級;

二、js實現:

document.onselectstart = function(){return false;}

document.onselectstart = null ;

jquery 實現:

$("body").hover(function(){

document.onselectstart = function(){return false;},

},

function(){

document.onselectstar=text;

}

});

註意:

1、onselectstart事件不被input和textarea標簽支持,而onselect事件只被input和textarea支持。
2、Firefox/Opera不支持onselectstart事件Firefox中可以使用CSS "-moz-user-select:none"屬性來禁止文本選定
3、webkit瀏覽器可以使用“-khtml-user-select”,當然也可以使用onselectstart事件來阻止用戶選定元素內文本,如下
<div onselectstart="return false">accc</div>

onselect

onselect是在文本框(input、textarea)內的文本被選中時所觸發的事件,其觸發時間是在文本被選擇以後(即文本已經被選擇,已經

顯式的表現出來)。該事件只被input和textarea標簽支持。

js或css指定元素點擊時內容不可被選中