知識 分享 互助 懶人建站

    懶人建站專注于網頁素材下載,提供網站模板、網頁設計、ps素材、圖片素材等,服務于【個人站長】【網頁設計師】和【web開發從業者】的代碼素材與設計素材網站。

    懶人建站提供網頁素材下載、網站模板
    知識 分享 互助!

    css禁止雙擊dom節點被選中user-select:none

    作者:佳明媽 來源:web前端開發 2016-10-02 人氣:
    當某個dom節點在快速重復點擊的時候出現這個節點被選中,有時候其實并不希望出現這種情況,比如我們使用一個span或者a標簽做為按鈕dom元素的時候,快速雙擊這個按鈕,就會出現按鈕

    css禁止dom節點被選中:

    當某個dom節點在快速重復點擊的時候出現這個節點被選中,有時候其實并不希望出現這種情況,比如我們使用一個span或者a標簽做為按鈕dom元素的時候,快速雙擊這個按鈕,就會出現按鈕被選中,
    禁止這個特性可以使用css屬性:user-select:none

    moz-user-select: -moz-none;
    -moz-user-select: none;
    -o-user-select:none;
    -khtml-user-select:none;
    -webkit-user-select:none;
    -ms-user-select:none;
    user-select:none;
    
    
    css禁止雙擊dom節點被選中user-select:none
    IE10平臺預覽第四版中包含了對 CSS3 新屬性 -ms-user-select 的支持,Web 開發人員可以利用這一新屬性輕松精確的控制用戶可以在網站上選擇哪些文本。 以較為典型的新聞網站為例,大多數頁面中會包含一條正文報道,有用戶習慣在瀏覽新聞報道的時候邊閱讀邊用鼠標選中內容,或者選中正文內容與他人進行分享。 與此同時,新聞網站頁面上還會包含一些其他內容和鏈接,用戶可能不需要選取這些內容。利用 -ms-user-select 屬性,Web 開發人員可以指定對內容正文開啟文本選擇功能, 而禁用選擇其他內容。 IE Test Drive 網站上提供了對此項功能的演示示例: -ms-user-select 屬性測試示例 對整個頁面設置 -ms-user-select:none,然后對包含博客正文的元素設置 -ms-user-select:element,這樣就可以僅允許選擇博客正文的內容。 -ms-user-select:element 是 IE 首次引入的一個新屬性,我們認為這一屬性在許多情況下將非常實用。 設置 -ms-user-select:element 表示用戶可以選擇該元素的文本,但選擇范圍受該元素的邊界的約束。希望選擇正文內容的用戶可能不希望選擇緊跟在正文后面的頁腳元素。 通過設置 -ms-user-select:element,用戶可以輕松地選擇正文內容,而不必擔心鼠標拉動位置過大選取了多余的內容。

    -ms-user-select可設置4個值:

    text – 可以選擇文本
    element – 可以選擇文本,但選擇范圍受元素邊界的約束
    none – 不可以選擇文本
    auto – 如果該元素包含可編輯的文本(如輸入元素或可編輯內容的元素),則可以選擇文本。否則,元素內容是否可選擇由父節點的值決定。
    -ms-user-select 的默認值為 auto。 通過將 -ms-user-select 設置為 none,開發人員可以禁用文本選擇功能。 在IE瀏覽器中,如果將文本設置為 -ms-user-select:none,則用戶將無法在該文本塊中開始選擇文本。 不過,如果用戶在頁面的其他區域開始選擇文本,則用戶可以在頁面的任何區域(包括 -ms-user-select 設置為 none 的區域)繼續選擇文本。 在 Firefox 中,如果開發人員設置 –moz-user-select:none,則用戶無法在該區域中開始選擇文本,也無法在任何其他文本選擇操作中包括該區域的文本。 在 Webkit 中,設置 –webkit-user-select:none 后,看起來該文本似乎并未包含在選擇范圍內,但是,當您復制并粘貼內容時,您會看到實際上已包含了該內容。 user-select 最初是在 CSS3 用戶界面模塊中提出的,之后,該模塊被 CSS3 基本用戶界面模塊所取代,但是后者并未定義該屬性。Mozilla 和 Webkit 均支持帶自定義前綴的屬性版本。 不過,如上所述,它們在屬性實現方面略有差異。
    ↓ 查看全文

    css禁止雙擊dom節點被選中user-select:none由懶人建站收集整理,您可以自由傳播,請主動帶上本文鏈接

    懶人建站就是免費分享,覺得有用就多來支持一下,沒有能幫到您,懶人也只能表示遺憾,希望有一天能幫到您。

    css禁止雙擊dom節點被選中user-select:none-最新評論

    老子是皇帝在线客服 福建体育36选7开 新江苏十一选五走势 500万完场比分旧版 十一选五天津 24500皇冠比分走地赔手机版 亚洲视频网站欧美视频网站 足球指数中心 3d试机号今天晚上金码 日本av女优t恤 韩国快乐8 澳洲幸运5微信群 日韩av片快播下载 山西新11选5 新浪彩票比分网下载 2019券商佣金排名 江苏十一选五开奖直