Computer >> Máy Tính >  >> Lập trình >> Javascript

Tạo tính năng "Sao chép vào khay nhớ tạm" trên trang web bằng JavaScript

Sau đây là mã để tạo tính năng "sao chép vào khay nhớ tạm" trên trang web bằng JavaScript -

Ví dụ

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result {
      font-size: 18px;
      font-weight: 500;
      color: rebeccapurple;
   }
   input,
   button {
      padding: 8px;
   }
</style>
</head>
<body>
<h1>Creating Copy to Clipboard</h1>
<input class="textCopy" type="text" />
<button class="Btn">Copy Text</button><br /><br />
<input type="text" placeholder="paste here" />
<h3>Click on the above button to copy text from the textbox</h3>
<script>
   let resEle = document.querySelector(".result");
   let BtnEle = document.querySelector(".Btn");
   let textCopyEle = document.querySelector(".textCopy");
   BtnEle.addEventListener("click", () => {
      textCopyEle.select();
      document.execCommand("copy");
   });
</script>
</body>
</html>

Đầu ra

Tạo tính năng  Sao chép vào khay nhớ tạm  trên trang web bằng JavaScript

Khi nhập nội dung nào đó vào hộp văn bản đầu tiên và nhấp vào nút “Sao chép văn bản” -

Tạo tính năng  Sao chép vào khay nhớ tạm  trên trang web bằng JavaScript

Dán văn bản bằng cách nhấp chuột trái và chọn dán vào hộp văn bản “dán vào đây” -

Tạo tính năng  Sao chép vào khay nhớ tạm  trên trang web bằng JavaScript