Copia il pulsante url corrente - Javascript

Question

ok potrebbe essere qualcosa di semplice o completamente sbagliato, tuttavia sto cercando di creare un pulsante per copiare l'URL corrente negli appunti, questo è ciò che attualmente ho, non ho molta familiarità con javascript quindi questo è da poche fonti mescolate insieme e sperando per il meglio.

<button onclick="CopyLink()">Click me</button> 
<script> 
function CopyLink() { 
window.clipboardData.setData("Text", location.href); 
} 
</script> 

Qualsiasi aiuto sarebbe fantastico grazie!

Answer 1

Utilizzando la funzione copyTextToClipboard da this answer, è possibile copiare il link su un pulsante fare clic su in questo modo:

function copyTextToClipboard(text) { 
 
    var textArea = document.createElement("textarea"); 
 

 
    // 
 
    // *** This styling is an extra step which is likely not required. *** 
 
    // 
 
    // Why is it here? To ensure: 
 
    // 1. the element is able to have focus and selection. 
 
    // 2. if element was to flash render it has minimal visual impact. 
 
    // 3. less flakyness with selection and copying which **might** occur if 
 
    // the textarea element is not visible. 
 
    // 
 
    // The likelihood is the element won't even render, not even a flash, 
 
    // so some of these are just precautions. However in IE the element 
 
    // is visible whilst the popup box asking the user for permission for 
 
    // the web page to copy to the clipboard. 
 
    // 
 

 
    // Place in top-left corner of screen regardless of scroll position. 
 
    textArea.style.position = 'fixed'; 
 
    textArea.style.top = 0; 
 
    textArea.style.left = 0; 
 

 
    // Ensure it has a small width and height. Setting to 1px/1em 
 
    // doesn't work as this gives a negative w/h on some browsers. 
 
    textArea.style.width = '2em'; 
 
    textArea.style.height = '2em'; 
 

 
    // We don't need padding, reducing the size if it does flash render. 
 
    textArea.style.padding = 0; 
 

 
    // Clean up any borders. 
 
    textArea.style.border = 'none'; 
 
    textArea.style.outline = 'none'; 
 
    textArea.style.boxShadow = 'none'; 
 

 
    // Avoid flash of white box if rendered for any reason. 
 
    textArea.style.background = 'transparent'; 
 

 

 
    textArea.value = text; 
 

 
    document.body.appendChild(textArea); 
 

 
    textArea.select(); 
 

 
    try { 
 
    var successful = document.execCommand('copy'); 
 
    var msg = successful ? 'successful' : 'unsuccessful'; 
 
    console.log('Copying text command was ' + msg); 
 
    } catch (err) { 
 
    console.log('Oops, unable to copy'); 
 
    } 
 

 
    document.body.removeChild(textArea); 
 
} 
 

 
function CopyLink() { 
 
    copyTextToClipboard(location.href); 
 
}

<button onclick="CopyLink()">Click me</button>