Vanilla JS: Sao chép vào bộ nhớ Clipboard

https://viblo.asia/p/vanilla-js-sao-chep-vao-bo-nho-clipboard-924lJ2gXlPM

by trung ken

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css">
<div class="container">
  <h1 class="my-5 text-center">Copy to clipboard</h1>
  <div>API Key</div>
  <div class="input-group mb-3">
    <input type="text" class="form-control" value="KTp90fd5JSy5M0Kdw3tCFGkUJ_8yC1MoXSs9DE" readonly>
    <div class="input-group-append">
      <button class="btn btn-primary">Copy</button>
    </div>
  </div>
  <div>Test</div>
  <input type="text" class="form-control">
</div>

JavaScript

const ipnElement = document.querySelector('input')
const btnElement = document.querySelector('button')

btnElement.addEventListener('click', function() {
  btnElement.innerText = 'Copied!'
  ipnElement.select()  
  document.execCommand('copy')
})