點擊div全選中再點擊取消全選div里面的文字


想做一個就是點擊一個div然后實現的功能是div里面的文字都成選中狀態,然后就可以利用瀏覽器的自帶的復制功能,任意復制在哪里去了

在網上百度了一下

然后網上的答案感覺很大的范圍

然后一些搜索

然后就鎖定了一個答案

就是那個頁面我忘記在哪里了

上我在頁面上寫的代碼吧

$('.modal-body').click(function(){
						var text=this;
						if (document.body.createTextRange) {
						        var range = document.body.createTextRange();
						        range.moveToElementText(text);
						        range.select();
						    } else if (window.getSelection) {
						        var selection = window.getSelection();
						        var range = document.createRange();
						        range.selectNodeContents(text);
						        selection.removeAllRanges();
						        selection.addRange(range);
						     
						    } else {
						        alert("none");
						    }
						
					})

 就是這樣了

網頁上一開始是原生了

就是一個function里面放if else

然后我就在想怎么把這個放進jQuery里面去

然后我一開始是寫了var text=$(this)

然后就開始報錯

(index):281 Uncaught TypeError: Failed to execute 'selectNodeContents' on 'Range': parameter 1 is not of type 'Node'.(…)

就出來這個錯誤

然后就開始谷歌

為什么錯誤

然后就搜索到了可靠答案

就是來自stackoverflow

不得不說 這個網站太牛逼了

你只要搜索的正確 里面有很多答案 基本上我只要搜索一個問題然后頁面上出來這個網站

我就覺得我的問題會得到解答

果然

然后這個網站告訴我的答案就是

var text=this而不是var text=$(this)

然后就完美解決了我的答案

然后也能執行了

網站上那個人是這樣說的

因為if里面text是javascript對象

然后你要是$(this)的話就是一個jQuery對象,所以運行起來就會報錯

厲害 佩服

 

后來我又發現了一個問題,那你一直是全選狀態這樣也不好吧

我看網上都是全選狀態的時候就是再點擊就可以取消全選

不是全選狀態的時候再選擇全選,這樣的需求才是正確的嘛

所以上面那段代碼已經不能滿足我們了

所以再上代碼

就是點擊全選再點擊取消全選

$('.modal-body').click(function(){
                var text=this;
                if(window.getSelection().toString().length>0){
                    return false;
                }else{
                    console.log(888);
                    if (document.body.createTextRange) {
                            var range = document.body.createTextRange();
                            range.moveToElementText(text);
                            range.select();
                        } else if (window.getSelection) {
                            var selection = window.getSelection();
                            var range = document.createRange();
                            range.selectNodeContents(text);
                            selection.removeAllRanges();
                            selection.addRange(range);
                         
                        } else {
                            alert("none");
                        }
                }
                
            })

恩,這樣差不多就符合我的需求了

 


免責聲明!

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



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