復制到剪貼板,粘貼進微信,換行符失效


問題描述

微信(windows)版本:v2.9.0

windows環境下,使用 copy-to-clipboard 實現 復制到剪貼板,粘貼進微信(windows),換行符失效。

原因

閱讀 copy-to-clipboard,clipboard-copy 等 package 源碼,發現實現方式是把數據放進 span 的 textContent,但是數據被 span 標簽格式化,數據前后發生了改變,導致換行符失效。

也有實現方式是把數據放進 input 的 value,同樣數據前后發生了改變,換行符失效。

ps:把復制前后的數據打印進控制台,看起來沒有區別,因為控制台對數據進行了轉碼,如何證明不一樣,待研究。(在瀏覽器的控制台,txt文件,復制到 textarea 轉為 charCode 均顯示一致。)

同理復現:windows 下,微信聊天框輸入換行的文字並復制,瀏覽器查看元素粘貼進span,然后失焦,然后點擊標簽復制內容,粘貼進微信聊天框,內容變成了不換行。

解決方案

textarea 天然支持 換行符,使用 textarea 代替 span 或 input。

function copyToClipboard(txt) {
  var textarea = document.createElement("textarea");
  textarea.value = txt;
  document.body.appendChild(textarea);
  textarea.select();
  document.execCommand("copy");
  document.body.removeChild(textarea);
}

whosmeya.com


免責聲明!

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



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