Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Membaca Kandungan Papan Klip pada Muatan Halaman Menggunakan API Papan Klip?

Bagaimana untuk Membaca Kandungan Papan Klip pada Muatan Halaman Menggunakan API Papan Klip?

Susan Sarandon
Lepaskan: 2024-10-27 13:30:02
asal
931 orang telah melayarinya

How to Read the Clipboard Content on Page Load Using the Clipboard API?

Cara Mengambil Kandungan Papan Klip pada Muatan Halaman

Pelayar web menyediakan API untuk mengakses papan keratan, membolehkan anda mendapatkan semula kandungannya pada halaman memuatkan tanpa interaksi pengguna. Ciri ini amat berguna untuk tugas seperti pra-mengisi medan teks atau memaparkan data papan keratan.

Menggunakan API Papan Klip

API Papan Klip (navigator.clipboard) menyediakan kaedah yang dipanggil readText(). Seperti namanya, ia membolehkan anda membaca kandungan teks semasa daripada papan keratan.

Anda boleh menggunakan API ini dalam dua cara: dengan sintaks tak segerak/menunggu atau sintaks Promise.

Dengan Sintaks Async/Await:

<code class="javascript">const text = await navigator.clipboard.readText();</code>
Salin selepas log masuk

Dengan Sintaks Promise:

<code class="javascript">navigator.clipboard.readText()
  .then(text => {
    console.log('Pasted content: ', text);
  })
  .catch(err => {
    console.error('Failed to read clipboard contents: ', err);
  });</code>
Salin selepas log masuk

Permintaan Kebenaran

Adalah penting untuk ambil perhatian bahawa API ini menggesa pengguna dengan kotak dialog permintaan kebenaran. Ini memastikan bahawa tiada skrip berniat jahat boleh mengakses data papan keratan tanpa kebenaran pengguna.

Penghadan dan Penyelesaian

API Papan Keratan tidak berfungsi dalam Firefox sejak versi 109. Jika anda perlu menyokong pengguna Firefox, anda boleh mempertimbangkan untuk menggunakan pustaka papan keratan pihak ketiga.

Untuk menjalankan kod API daripada konsol, anda boleh menggunakan tamat masa dan klik dengan cepat dalam tetingkap tapak web.

<code class="javascript">setTimeout(async () => {
  const text = await navigator.clipboard.readText();
  console.log(text);
}, 2000);</code>
Salin selepas log masuk

Sumber Tambahan

Untuk mendapatkan maklumat lanjut dan garis panduan penggunaan, rujuk dokumentasi pembangun Google berikut:

  • [Clipboard API](https:/ /developer.mozilla.org/en-US/docs/Web/API/Clipboard_API)
  • [Spesifikasi](https://w3c.github.io/clipboard-apis/)

Atas ialah kandungan terperinci Bagaimana untuk Membaca Kandungan Papan Klip pada Muatan Halaman Menggunakan API Papan Klip?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan