[HTML] Make A Button To Copy Text - Clay-Technology World

Trang chủ » Html Code To Copy Text » [HTML] Make A Button To Copy Text - Clay-Technology World

Có thể bạn quan tâm

I have always wanted to make a button to copy the text of a html block, that can help a project I am developing very well. Therefore, I studied it today and recorded it.

The method of implementation is also quite simple. You only need to set the ID of the block to be copied.

Demo <p id="copy">This is the copy string!</p> <button type="button" onclick="copyEvent('copy')">Copy</button> <script> function copyEvent(id) { var str = document.getElementById(id); window.getSelection().selectAllChildren(str); document.execCommand("Copy") } </script>

This is the copy string!

Copy COPY

The top block, the block with id="copy", is the text I expect to copy “This is the copy string!”. Below is a simple button, which is triggered by the JavaScript script below.

In JS, I defined a copyEvent() function, which is mainly to copy the string corresponding to the block with a specific ID.

The displayed screen is as follows:

After clicking, find a notepad to paste:

Share this:

  • X
  • Facebook
  • LinkedIn
  • Reddit

相關

Từ khóa » Html Code To Copy Text