4

По нажатию на кнопку должен быть вставлен текст из буфера обмена, но выходит ошибка Cannot read property "clipboardData" of undefined.

const pasteFromBuffer = document.querySelector('.paste-button');
const textareaPaste = document.querySelector('.input');

function handlePaste(event) {
  const clipboardData = event.clipboardData || window.clipboardData;
  const pastedData = clipboardData.getData('Text');
  console.log(pastedData);
  textareaPaste.innerText = pastedData;
}

pasteFromBuffer.addEventListener('click', handlePaste);
<input class="input"></input>
<button class="paste-button">Paste</button>

6
  • А что тут должно происходить?
    – TheMY3
    15 июл 2020 в 6:24
  • по нажатию на кнопку в инпут должен быть вставлен текст из буфера обмена
    – Imp3l
    15 июл 2020 в 6:25
  • Не понятен контекст, но, возможно, нужно дождаться загрузки DOM: document.addEventListener('DOMContentLoaded', function() { })
    – Aleksandr
    15 июл 2020 в 6:25
  • @Александр, нет, тут он точно успеет прогрузится.
    – Node_pro
    15 июл 2020 в 6:53
  • 2
    @Imp3l, на click такого свойства нету. clipboardData - этого тоже. Если я правильно помню, есть оно на событиях буфера - paste,....
    – Node_pro
    15 июл 2020 в 7:00

1 ответ 1

2

Вы можете воспользоваться clipboard API, сделав вот так:

const pasteFromBuffer = document.querySelector( ".paste-button")
const textareaPaste = document.querySelector(".input")

const handlePaste = async event => {
    const clipboardData = await navigator.clipboard.readText()
    textareaPaste.value = clipboardData
    console.log(textareaPaste.value)
}

pasteFromBuffer.addEventListener("click", handlePaste, false)

Имейте ввиду что большинство браузеров запросят у пользователя подтверждения прав доступа к данным clipboard.

Так же этот метод не будет работать из консоли, так как требует непосредственного действия пользователя, например, нажатия на кнопку.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.