자바 스크립트로 클립 보드 조작 서식 지정 중단

Question

나는 Tynt에서 볼 수있는 기능과 비슷한 사용자의 클립 보드에 링크하는 속성을 추가하는 스크립트를 작성하고 있습니다.

아래의 스크립트는 줄 바꿈 및 서식을 제거한다는 점을 제외하고는 정상적으로 작동합니다. 적어도 줄 바꿈을 보존 할 여지가 있습니까?

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 = "<br/><br/>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 

} 

Answer 1

약간의 연구 끝에 나는 여기서 무슨 일이 일어나고 있는지 알았고 줄 바꿈을 유지하기위한 수정을했습니다. 선택을 복사 할 때 줄 바꿈이 \ n으로 표시되는 것처럼 보입니다. 그래서 모든 논리를 추가하여 \ n 인스턴스를 HTML 브레이크
으로 바꾸면 문제가 해결됩니다. 다음은 업데이트 된 스크립트입니다.

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 = "<br/><br/>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, '<br />'); 

    // 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;