navigator.clipboard.writeText() не работает

163
18 марта 2022, 20:50

Есть php, он при определённых событиях выводит button.

printf('<button onclick="setclipboard()">Copy text</button>');

При нажатии на которую по идее должна срабатывать функция setclipboard().

А вот и она:

<script>
function setclipboard(){
   navigator.clipboard.writeText("someText").then(function() {
//1
}, function() {
//2
   });
}
</script>

Я пытаюсь сделать так, чтобы при нажатии на кнопку копировался текст "someText".

Но оно не работает. Почему? Что я делаю не так?

Answer 1

Функция setclipboard видимо "не видна" из контекста вызова.

Попробуй так:

window.setclipboard = function () {
    navigator.clipboard.writeText("someText").then(function () {
//1
    }, function () {
//2
    });
};
Answer 2

Для примера (Есть, к примеру, поле ввода, или любое другое поле):

<?php
$bz = "1"; // К примеру, есть переменная.
?>
<div>Отсюда копируем текст</div>
<input id="textForCopy">
<?php
if ($bz == "1"){ // Выполняем проверку. Если переменная = 1, то показываем кнопку, которая копирует текст в буффер обмена.
    printf('<button onclick="setclipboard()">Copy text</button>');
}
?>
<div>Сюда вставляем текст из буффера</div>
<input>
<script language="JavaScript">
    function setclipboard(){
        let text = document.getElementById('textForCopy').value; // получаем введённый в поле текст
        navigator.clipboard.writeText(text).then(function() { // Копируем текст в буффер обмена
//1
        }, function() {
//2
        });
    }
</script>

Как это работает, когда есть кнопка:

    function setclipboard(){ 
        let text = document.getElementById('textForCopy').value; 
        navigator.clipboard.writeText(text).then(function() { 
//1 
        }, function() { 
//2 
        }); 
    }
<div>Отсюда копируем текст</div> 
<input id="textForCopy"> 
<button onclick="setclipboard()">Copy text</button> 
<div>Сюда вставляем текст из буффера (Ctrl + v)</div> 
<input>

Answer 3

Ответ нашелся. Дело в том что на хостинге где проводились тесты был http протокол. Судя по документации, для работы clipboard необходимо чтобы соединение было доверенным.

READ ALSO
ReactJS: Как присвоить переменным результат fetch(список объектов)?

ReactJS: Как присвоить переменным результат fetch(список объектов)?

Новичок в js: Необходимо использовать переменные storeProducts(массив объектов) и detailProduct(конкретный объект) далее в программе, но они не видны за пределами...

77
хеш таблица в js

хеш таблица в js

Вопрос странныйЕсть ли в js встроенная хеш-функция для хеш таблиц? Искал информацию, не нашел

184
Что не так я не понимаю в чем ошибка Uncaught TypeError: Cannot set property &#39;innerHTML&#39; of null [закрыт]

Что не так я не понимаю в чем ошибка Uncaught TypeError: Cannot set property 'innerHTML' of null [закрыт]

Хотите улучшить этот вопрос? Обновите вопрос так, чтобы он вписывался в тематику Stack Overflow на русском

205
Потеря state React

Потеря state React

Не пойму, почему теряется стейт при отработке события, если я его, вроде, не мутирую

62