कैसे करें - टेक्स्ट को क्लिपबोर्ड पर कॉपी करें
जावास्क्रिप्ट के साथ टेक्स्ट को क्लिपबोर्ड पर कॉपी करने का तरीका जानें।
टेक्स्ट फ़ील्ड से टेक्स्ट को कॉपी करने के लिए बटन पर क्लिक करें।
टेक्स्ट को क्लिपबोर्ड पर कॉपी करें
चरण 1) HTML जोड़ें:
उदाहरण
<!-- The text field -->
<input type="text" value="Hello World" id="myInput">
<!-- The button used to copy the text -->
<button onclick="myFunction()">Copy
text</button>
चरण 2) जावास्क्रिप्ट जोड़ें:
उदाहरण
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);
}
कॉपी किए गए टेक्स्ट को टूलटिप में प्रदर्शित करें
सीएसएस जोड़ें:
उदाहरण
.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;
}