Rumah > hujung hadapan web > tutorial css > Bagaimana untuk Menyembunyikan Medan Teks dalam Elemen Input Fail?

Bagaimana untuk Menyembunyikan Medan Teks dalam Elemen Input Fail?

Susan Sarandon
Lepaskan: 2024-12-11 20:21:11
asal
371 orang telah melayarinya

How to Hide the Text Field in File Input Elements?

Menyembunyikan Medan Teks dalam Elemen Input Fail

Elemen input fail biasanya memaparkan kedua-dua medan teks dan butang untuk menyemak imbas fail. Walau bagaimanapun, sesetengah senario memerlukan antara muka butang sahaja tanpa sebarang medan teks yang boleh dilihat.

Penyelesaian:

Untuk mencapai matlamat ini, anda boleh menggunakan pendekatan berikut:

  1. Buat input fail yang tidak kelihatan (tersembunyi) elemen:

    <input type="file">
    Salin selepas log masuk
  2. Tambahkan butang yang boleh dilihat yang mencetuskan elemen input fail tersembunyi:

    <input type="button" value="Browse..." onclick="document.getElementById('selectedFile').click();" />
    Salin selepas log masuk

Apabila butang diklik, ia mencetuskan peristiwa klik elemen input fail tersembunyi, membenarkan pengguna memilih fail tanpa melihat medan teks.

Teknik ini berfungsi dengan berkesan untuk senario di mana nilai input fail tidak diperlukan, seperti dalam skrip muat naik berbilang fail. Ia meningkatkan antara muka pengguna dengan meminimumkan elemen yang tidak perlu, menghasilkan bentuk yang lebih diperkemas dan mesra pengguna.

Atas ialah kandungan terperinci Bagaimana untuk Menyembunyikan Medan Teks dalam Elemen Input Fail?. 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