Chciałbym wiedzieć, jak sprawić, by mój skrypt wykrył zawartość schowka i wkleił ją do pola tekstowego po otwarciu strony, bez udziału użytkownika. Jak można to zrobić?
javascript
clipboard
paste
Gabriele Cirulli
źródło
źródło
Odpowiedzi:
window.clipboardData.getData('Text')
będzie działać w niektórych przeglądarkach. Jednak wiele przeglądarek, w których to działa, zapyta użytkownika, czy chce, aby strona internetowa miała dostęp do schowka.źródło
Użyj nowego interfejsu API schowka , za pośrednictwem
navigator.clipboard
. Można go używać w następujący sposób:navigator.clipboard.readText() .then(text => { console.log('Pasted content: ', text); }) .catch(err => { console.error('Failed to read clipboard contents: ', err); });
Lub ze składnią asynchroniczną:
const text = await navigator.clipboard.readText();
Należy pamiętać, że spowoduje to wyświetlenie użytkownikowi okna dialogowego z prośbą o pozwolenie, więc żadne śmieszne interesy nie są możliwe.
Powyższy kod nie zadziała, jeśli zostanie wywołany z konsoli. Działa tylko wtedy, gdy uruchomisz kod na aktywnej karcie. Aby uruchomić kod z konsoli, możesz ustawić limit czasu i szybko kliknąć w oknie witryny:
setTimeout(async () => { const text = await navigator.clipboard.readText(); console.log(text); }, 2000);
Przeczytaj więcej na temat interfejsu API i użytkowania w dokumentacji Google dla programistów .
Spec
źródło
setTimeout
, a następnie klikając z powrotem na stronę.Możesz użyć
window.clipboardData.getData('Text')
aby pobrać zawartość schowka użytkownika w IE. Jednak w innej przeglądarce może być konieczne użycie Flasha, aby pobrać zawartość, ponieważ nie ma standardowego interfejsu umożliwiającego dostęp do schowka. Może możesz spróbować tej wtyczki Zero Clipboard
źródło
Poniżej znajdziesz wybraną zawartość, a także zaktualizujesz schowek.
Powiąż identyfikator elementu ze zdarzeniem copy, a następnie pobierz wybrany tekst. Możesz zamienić lub zmodyfikować tekst. Weź schowek i ustaw nowy tekst. Aby uzyskać dokładne formatowanie, musisz ustawić typ jako „text / hmtl”. Możesz również powiązać go z dokumentem zamiast elementu.
document.querySelector('element').bind('copy', function(event) { var selectedText = window.getSelection().toString(); selectedText = selectedText.replace(/\u200B/g, ""); clipboardData = event.clipboardData || window.clipboardData || event.originalEvent.clipboardData; clipboardData.setData('text/html', selectedText); event.preventDefault(); });
źródło