Gewusst wie: Kopieren Sie Text in die Zwischenablage
Erfahren Sie, wie Sie mit JavaScript Text in die Zwischenablage kopieren.
Klicken Sie auf die Schaltfläche, um den Text aus dem Textfeld zu kopieren.
Text in die Zwischenablage kopieren
Schritt 1) HTML hinzufügen:
Beispiel
<!-- The text field -->
<input type="text" value="Hello World" id="myInput">
<!-- The button used to copy the text -->
<button onclick="myFunction()">Copy
text</button>
Schritt 2) JavaScript hinzufügen:
Beispiel
function myFunction() {
/* Get the text field */
var copyText = document.getElementById("myInput");
/* Select the text field */
copyText.select();
copyText.setSelectionRange(0, 99999); /* For mobile devices */
/* Copy the text inside the text field */
navigator.clipboard.writeText(copyText.value);
/* Alert the
copied text */
alert("Copied the text: " + copyText.value);
}
Kopierten Text in einem Tooltip anzeigen
CSS hinzufügen:
Beispiel
.tooltip {
position: relative;
display: inline-block;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 140px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px;
position: absolute;
z-index: 1;
bottom: 150%;
left: 50%;
margin-left: -75px;
opacity: 0;
transition: opacity 0.3s;
}
.tooltip .tooltiptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent
transparent;
}
.tooltip:hover
.tooltiptext {
visibility: visible;
opacity: 1;
}