setTimeout и копирование значения кнопки в буфер обмена

Question

У меня есть кнопка, и я хотел бы скопировать ее значение в буфер обмена после того, как мышь наведет его на одну секунду, используя только javascript, не jQuery , если этого можно избежать.

У меня есть две проблемы с этим кодом:

1. SetTimeout не работает - оповещение происходит сразу, без ожидания одной секунды, и
2. Я получаю "TypeError: null не является объектом (оценивает 'document.getElementById (obj) .value') "error

function getButtonValue(obj) {
  document.getElementById(obj).value.execCommand("copy");
  alert("\"" + obj.value + "\" has been copied to the clipboard.");
} // function getid(obj)

<input type="button" id="button2" value="bite me" onmouseover="setTimeout(getButtonValue(this), 1000);" />

Answer 1

Вы вызываете метод вместо того, чтобы назначить его на settimeout

, вот как вы это сделаете

   function getButtonValue(obj) {
obj.focus();
obj.select();
const result = document.execCommand('copy');
if (result === 'unsuccessful' || result == false) {
console.log('Failed to copy text.');
}    
} // function getid(obj)

<input type="button" id="button2" value="bite me" onmouseover="setTimeout(()=> getButtonValue(this), 1000);" />

Answer 2

Если вы получаете разрешения, вы можете сделать это - идея из другого ответа, который не был реализован правильно

https://developers.google.com/web/updates/2018/03/clipboardapi

var tId = "";

navigator.permissions.query({
  name: 'clipboard-read'
}).then(permissionStatus => {
  // Will be 'granted', 'denied' or 'prompt':
  console.log(permissionStatus.state);

  // Listen for changes to the permission state
  permissionStatus.onchange = () => {
    console.log(permissionStatus.state);
  };
})

document.getElementById("button2").addEventListener("mouseover", function(e) {
  var val = this.value;
  setTimeout(function() {
    navigator.clipboard.writeText(val)
      .then(() => console.log(val + " copied"))
      .catch(err => {
      // This can happen if the user denies clipboard permissions:
      console.error('Could not copy text: ', err);
    });
  }, 1000)
})

document.getElementById("button2").addEventListener("mouseout", function() {
  clearTimeout(tId);
});

<input type="button" id="button2" value="bite me" />