javascript - 關(guān)于禁用文本選擇與復(fù)制的問題
問題描述
樣式如下.test1 { user-select: none;}html 結(jié)構(gòu)如下
<body><p class='content'> <p class='test2'>111</p> <p class='test1'>222</p> <p class='test2'>333</p> <p class='test1'>444</p> <p class='test2'>555</p></p></body>
給其中的某幾項做了禁用本文選擇,單獨對某一項選擇時,確實能夠禁用選擇,其中的內(nèi)容也無法復(fù)制,但是如果用cmd + a 進(jìn)行全選時,會看到被禁用的項在頁面上顯示的是沒有被選擇,但此時內(nèi)容能被復(fù)制下來。
接下來用 js 去控制:[].forEach.call(document.querySelectorAll(’.test1’), (node) => { node.addEventListener(’copy’, (e) => { e.stopPropagation(); e.preventDefault(); console.log(1); return false; }, true); node.addEventListener(’selectstart’, (e) => { e.stopPropagation(); e.preventDefault(); console.log(2); return false; }, true);});
發(fā)現(xiàn)還是會在單獨選取時生效,但全部選取時就失敗了,所以想問下有什么辦法能夠在可選取的節(jié)點中穿插不可選取的節(jié)點,還能使得全選復(fù)制時只選取到可選取的內(nèi)容。
問題解答
回答1:可以換種思路,比如把文本放到css中。css中的文本就完全無法選中和復(fù)制了。隨手寫了個測試代碼:
JsFiddle: https://jsfiddle.net/d95cugaL/
JsBin: http://jsbin.com/nowoxuceta/e...
或者再進(jìn)一步,直接把文本放在圖片上...
回答2:這兒有個思路,就是你可以禁止ctrl+c的鼠標(biāo)事件。//禁止ctrl復(fù)制
document.onkeydown=function(){ if((event.ctrlKey) && (window.event.keycode==67)){ event.returnValue=false; alert('Ctrl+C被禁止啦!'); }}
如果全選有問題,也可以禁止ctrl+A
相關(guān)文章:
1. mac里的docker如何命令行開啟呢?2. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””3. docker - 各位電腦上有多少個容器啊?容器一多,自己都搞混了,咋辦呢?4. 關(guān)于docker下的nginx壓力測試5. docker容器呢SSH為什么連不通呢?6. nignx - docker內(nèi)nginx 80端口被占用7. 如何解決Centos下Docker服務(wù)啟動無響應(yīng),且輸入docker命令無響應(yīng)?8. docker 下面創(chuàng)建的IMAGE 他們的 ID 一樣?這個是怎么回事????9. angular.js使用$resource服務(wù)把數(shù)據(jù)存入mongodb的問題。10. docker start -a dockername 老是卡住,什么情況?

網(wǎng)公網(wǎng)安備