複製文字加上版權資訊功能實現

2021-09-14 02:36:52 字數 376 閱讀 8410

有些**為了維護版權資訊, 使用者在複製完成後, 發現粘帖出來的內容往往都還有一些作者名字之類的版權資訊, 那麼這樣的功能是怎麼實現的呢? 其實原理也是非常的簡單,就是監聽一下剪下板事件.

前端好難學啊

原理: 監聽文字複製事件, 並阻止事件預設行為,window .getselection()表示選中的文字內容, 再呼叫clipboarddata.setdata()方法將修改後的文字新增到剪下板

猛戳這裡檢視clipboarddata物件的相容性

注意

js複製文字功能實現,適用於Android和IOS

首先文字只有選中才可以複製,所以簡單的做法就是建立乙個隱藏的input,然後繫結需要複製的文字。另外如果將input設定為 type hidden 或者display none則無法選中文字,也就無法複製,可以設定position absolute left 999px 來隱藏文字域。const c...

React 實現複製功能

以下都是antd4.x的寫法 hook寫法 通過useref import react,from react import styles from index.less import from antd const export props return 請複製鏈結到瀏覽器開啟 p value re...

js實現複製功能

在一些涉及到個人資訊比較多的h頁面,經常可能會出現複製賬號到剪下板的功能,那麼怎麼用js怎麼實現複製貼上功能呢?正好最近開發的模組中又有乙個這樣的功能,總結一下,方便後面使用。效果圖 核心 require clipboard function clipboard aftercopy function...