select()事件默認選中文本框的全部內容,並改變其背景色和文字顏色


1、select()事件默認選中文本框的全部內容

  拿到input標簽的節點,調用select()方法即可。但是我做的vue項目中調用了此方法有一個bug,單次點擊會全選內容,雙次點擊的時候全選會閃一下后,然后全選狀態消失,后來經過測試是因為事件重復觸發了,但還沒有找到解決的辦法,苦惱。。。。

  ps:下午找到了解決的方法:

    在vue組件中使用的select()方法換成setSelectionRange(0,1)即可、每次觸發focus事件的時候都會默認全選全部文本。這個時候就會有人問了,如果只想選中部分文本怎么辦,那么這個時候就體現出setSelectionRange(a, b)這個方法的好處了,假如你只想選中前           四個字符串,那么參數可以傳(0, 4),或者b-a 等於你想要選中的字符串個數就可以了,舉個例子(4, 8),這樣也可以選中前四個字符串,不過我目前還沒有找到可以利用事件來選中中間一段文本的方法。    對了,有一點setSelectionRange(a, b)這個方法這我們公司的項           目里只能起到默認全選的狀態!!!

2、改變全選狀態下的文字背景顏色和文字顏色

  節點::selection { background:#ccc;  color:#ff645d; }

  節點::-moz-selection { background:#ccc;  color:#ff645d; }

  節點::-webkit-selection { background:#ccc;  color:#ff645d; }

 

覺得好用的話記得給博主點贊呦!


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM