防止內容被選中

2021-09-06 03:19:04 字數 1090 閱讀 5769

在開發拖動效果時,有乙個非常惱人的地方要處理時,就是拖動時,文字被選中藍色一片,容易造成使用者分心,有損使用者體驗。通常我們是用下面**來清理selection:

if(window.getselection)else  if(document.selection)
但這東西在谷歌瀏覽器中,快速拖動還是會出現藍色(人家的渲染效率就是高),另外,每拖動一畫素就清理一次,這頻繁的呼叫對於一些舊式瀏覽器可不是好事。最近研究css3,發現user-select這個東西,終於搞定這問題了。

首先,我們要檢測瀏覽器是否支援它,ff與webkit系瀏覽器是支援,ie9與opera11是不支援。

//by 司徒正美

//var getstylename= (function());

if(test in style)

}return null;

}return getstylename;

})();

alert(getstylename("user-select"))

對於不支援的瀏覽器,我們可以借助它們的一些私有屬性與事件,如unselectable,onselectstart。當拖動時,我們把它們繫結在文件物件上就行了。

if(typeof userselect === "string")

document.unselectable = "on";

document.onselectstart = function()

當拖動結束時,我們再讓文件變回可選擇模式,注意一些值的變化,都是很奇特的名字。

if(typeof userselect === "string")

document.unselectable = "off";

document.onselectstart = null;

具體應用見下: 1

onedom.require

2two

controljs

3three

headjs

4four

lab.js

5five

$script.js

6six

nbl.js

執行**

CTreeCtrl 使某個節點被選中

一 建立樹形控制項 m operatelist.create ws visible ws tabstop ws child ws border tvs hasbuttons tvs linesatroot tvs haslines tvs disabledragdrop tvs trackselec...

關於jQuery獲取被選中的checkbox

1.判斷checkbox是否被選中if checkboxid attr checked true 2.checkbox的幾種操作 a input name checkboxname attr checked true 全選 b input name checkboxname removeattr c...

CSS如何美化被選中的文字

css的作用就是用來美化網頁的內容或者結構層次。這我們都知道,不是嗎?隨著css技術的不斷革新公升級,我們獲得了更多的控制樣式的能力。乙個不是那麼眾所周知的技術就是我們可以在瀏覽器裡美化被選擇的文字的樣式。windows自身提供的是一種很難看的墨綠色的顏色,而蘋果電腦上提供的是淺綠色。火狐瀏覽器,i...