使用JavaScript操作剪贴板会破坏格式化

我正在编写一个脚本来附加链接到用户剪贴板的属性 – 类似于您从Tynt看到的function。

从function上讲,下面的脚本工作正常,只是它删除换行符和格式。 无论如何要保留 – 至少 – 换行?

function addLinktoCopy() { // Define tracking parameter var trackingparam = "source=copypaste"; // Set document body as body_element variable var body_element = document.getElementsByTagName('body')[0]; // Create a selection variable to store copied value var selection; // Populate selection variable with user's selected copy selection = window.getSelection(); // Create a variable to store the selection length var selectionlength; // Convert the selection to a string and get the string's length selectionlength = selection.toString().length // If the selectionlength is >34, then append tracking if ( selectionlength > 34 ){ // Set the current page's URL as a variable var page = document.location.href; // Create a seperator variable var seperator; // Create a locationURL variable to store the URL and associated tracking parameters var locationURL; // Check to see if the URL already contains the tracking paramater // If the URL doesn't contain the tracking code, append it to the end if ( page.indexOf(trackingparam) == -1 ) { // Check to see if the URL already includes a ? in it if ( page.indexOf("?") != -1 ) { // If ? is present in the URL string, set seperator variable to & seperator = "&"; } else { // If ? is not present in the URL string, set seperator variable to ? seperator = "?"; } // Set locationURL variable with URL + tracking code locationURL = document.location.href + seperator + trackingparam; } // Othwerise, the tracking code already exists in the URL string, so append nothing else { // Set the locationURL variable with the URL as is locationURL = document.location.href; } // Build link to page with editorial copy, URL, seperator, and URL tracking parameters var pagelink = "

Read more at: "+ locationURL; // Create new variable with user's selection and page link var copytext = selection + pagelink; // Create a new div and add associated styling and hide it off the page var newdiv = document.createElement('div'); // Append new div to document body_element.appendChild(newdiv); // Select text from the new (hidden) div newdiv.innerHTML = copytext; // Replace clipboard values with new selection + link value selection.selectAllChildren(newdiv); } // Otherwise, selectionlength <= 34, so do nothing // We are not appending any copy or URLs to the user's selection }

经过一番研究后,我弄清楚这里发生了什么,并做了修复以保留换行符。 看起来复制选择时,换行符表示为\ n。 所以,我添加了一些逻辑来用HTML中断替换所有\ n实例
,这解决了这个问题。 这是完整的更新脚本。

 function addLinktoCopy() { // Define tracking parameter var trackingparam = "source=copypaste"; // Set document body as body_element variable var body_element = document.getElementsByTagName('body')[0]; // Create a selection variable to store copied value var selection; // Create a selection to store the selection as a text string var selectedText; // Populate selection variable with user's selected copy selection = window.getSelection(); // Populate selectedText variable with the user's selected copy stored as a string selectedText = selection.toString(); // Create a variable to store the selection length var selectionlength; // Convert the selection to a string and get the string's length selectionlength = selection.toString().length // If the selectionlength is >34 and doesn't start with "http://", then append tracking // If the selection starts with "http://", it's likely a URL, which could provide for a bad experience when pasting into an address bar if ( (selectionlength > 34) && (selectedText.substring(0,7) != "http://") ){ // Set the current page's URL as a variable var page = document.location.href; // Create a seperator variable var seperator; // Create a locationURL variable to store the URL and associated tracking parameters var locationURL; // Check to see if the URL already contains the tracking paramater // If the URL doesn't contain the tracking code, append it to the end if ( page.indexOf(trackingparam) == -1 ) { // Check to see if the URL already includes a ? in it if ( page.indexOf("?") != -1 ) { // If ? is present in the URL string, set seperator variable to & seperator = "&"; } else { // If ? is not present in the URL string, set seperator variable to ? seperator = "?"; } // Set locationURL variable with URL + tracking code locationURL = document.location.href + seperator + trackingparam; } // Othwerise, the tracking code already exists in the URL string, so append nothing else { // Set the locationURL variable with the URL as is locationURL = document.location.href; } // Build link to page with editorial copy, URL, seperator, and URL tracking parameters var pagelink = "

Read more at: "+ locationURL; // Create new variable with user's selection and page link var copytext = selection + pagelink; // Replace line breaks /n with HTML break tags to quasi-preserve formatting on paste var copytext = copytext.replace(/\n/g, '
'); // Create a new div and add associated styling and hide it off the page var newdiv = document.createElement("div"); // Append new div to document body_element.appendChild(newdiv); // Select text from the new (hidden) div newdiv.innerHTML = copytext; // Replace clipboard values with new selection + link value selection.selectAllChildren(newdiv); } // Otherwise, selectionlength <= 34, so do nothing // We are not appending any copy or URLs to the user's selection } // Execute addLinktoCopy function when user copies text from page document.oncopy = addLinktoCopy;
Interesting Posts