Js - 複製粘貼

時間 2020-08-07 標籤 js 複製粘貼

document.execCommand 使用官方文檔

關注「弋凡」（YiFan）微信公衆號吧記錄簡單筆記作你的最愛javascript

document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)
返回類型是布爾值，表示是否支持
aCommandName
命令的名稱
aShowDefaultUI
一個 Boolean，是否展現用戶界面
aValueArgument
一些命令（例如insertImage）須要額外的參數（insertImage須要提供插入image的url），默認爲null,通常不用html

aCommandName 命令 主要有
`backColor`
修改文檔的背景顏色這須要一個<color> 類型的字符串值做爲參數傳入
`bold`
開啓或關閉選中文字或插入點的粗體字效果
`copy`
拷貝當前選中內容到剪貼板
`cut`
剪貼當前選中的文字並複製到剪貼板
`delete`
刪除選中部分
`insertImage`
在插入點插入一張圖片（刪除選中的部分）。須要一個 URL 字符串做爲參數
`paste`
在光標位置粘貼剪貼板的內容
`redo`
重作被撤銷的操做
`removeFormat`
對所選內容去除全部格式

具體使用

只能對輸入框的值進行操做java

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<input id="input" value=" 你好 世界 !">
<button id="btn">點我複製</button>

</body>
<script> let btn = document.querySelector('#btn'); btn.addEventListener('click', () => { let input = document.querySelector('#input'); // let input = document.getElementById("input"); 2種均可 input.select(); if (document.execCommand('copy')) { document.execCommand('copy'); alert("複製成功") } }) </script>

</html>

若需進行復制操做又不想有輸入框
暴力解決添加固定定位便可
position: fixed;top: -1000pxweb

Js - 複製 粘貼

document.execCommand 使用官方文檔

具體使用

快來關注「弋凡」微信公衆號吧

Js - 複製粘貼