如何在 HTML 中複製元素內容時執行指令碼？

當用戶複製元素內容時，會觸發 oncopy 事件。當用戶複製元素（例如使用 <img> 元素建立的影像）時，也會觸發 oncopy 事件。型別為 "text" 的 <input> 元素通常使用 oncopy 事件。

以下是示例…

示例

在以下示例中，我們在複製 <input> 元素文字時執行 JavaScript。

<!DOCTYPE html>
<html>
<body>
   <input type="text" oncopy="myFunction()" value="Welcome to tutorialspoint">
   <p id="tutorial"></p>
   <script>
      function myFunction() {
         document.getElementById("tutorial").innerHTML = "Text is copied!"
      }
   </script>
</body>
</html>

輸出

當指令碼執行時，視窗會彈出一個包含“歡迎來到 tutorialspoint”的文字，當我們嘗試複製文字時，它會顯示“文字已複製”。

示例：（使用 addEventListener()）

在以下示例中，我們使用 addeventlistener() 方法來了解文字何時被複制。

<!DOCTYPE html>
<html>
<body>
   <input type="text" id="tutorial" value="The Best E-Way">
   <script>
      document.getElementById("tutorial").addEventListener("copy", mytutorial1);
      function mytutorial1() {
         alert("Text Get Copied !");
      }
   </script>
</body>
</html>

輸出

執行上述指令碼後，它將顯示文字“最好的電子方式”，當我們嘗試複製文字時，它會建立一個警報，提示“文字已複製”。

更新於：2022-09-05

111 次檢視

開啟你的 職業生涯

透過完成課程獲得認證

立即開始
廣告