Medan Input Teks
Kumpulkan teks dengan tepat dan fleksibiliti. Daripada nama mudah kepada corak kompleks dengan pengesahan terbina dalam, pemformatan pintar dan penyesuaian yang berkuasa – medan Input Teks menyesuaikan diri dengan sebarang kes penggunaan dengan had aksara, pemformatan automatik dan mod kata laluan selamat.
Asas Setiap Borang WordPress
Sesuai untuk:
Ciri-ciri Hebat untuk Setiap Kes Penggunaan
📏 Kawalan Panjang Pintar
Had Aksara Minimum & Maksimum
Tetapkan entri teks terpendek dan terpanjang yang dibenarkan. Cegah penyerahan yang terlalu pendek atau terlalu panjang dengan pengesahan pelayar terbina dalam.
Pengesahan Masa Nyata
Pengguna akan mendapat maklum balas segera jika entri mereka tidak memenuhi syarat panjang – tiada kejutan selepas penyerahan.
Contoh:
- Nama Pengguna: Minimum 3, Maksimum 20 aksara
- Poskod: Minimum 5, Maksimum 10 aksara
- Nama: Minimum 2, Maksimum 50 aksara
- Komen: Maksimum 500 aksara
Mengapa Ia Perkara:
Kawal kualiti data, cegah spam, pastikan keserasian pangkalan data dan bimbing pengguna untuk memberikan jumlah maklumat yang betul.
✅ Corak Pengesahan Terbina Dalam
6 Jenis Pengesahan Pra-Konfigurasi:
- 1. Tiada – Terima sebarang teks (lalai)
2. E-mel – Mengesahkan format e-mel yang betul ([e-mel dilindungi])
3. URL – Memerlukan alamat web yang sah (https://example.com)
4. Huruf Sahaja – Hanya aksara abjad dan ruang (John Doe)
5. Nombor Sahaja – Digit angka sahaja (123456)
6. Alfanumerik – Huruf dan nombor, tiada aksara khas (Pengguna123)
Tambahan Corak Tersuai:
- Tentukan pengesahan regex anda sendiri untuk format khusus seperti:
- Plat lesen: `^[AZ]{3}[0-9]{4}$`
- Kod produk: `^[AZ]{2}[0-9]{6}$`
- Format tersuai yang unik untuk perniagaan anda
Maklum Balas Segera:
Pengguna akan melihat mesej ralat yang jelas jika input mereka tidak sepadan dengan format yang diperlukan.
✂️ Pemangkasan Ruang Putih Automatik
Bersihkan Data Secara Automatik
Alih keluar ruang yang tidak disengajakan dari awal dan akhir entri teks. Tiada lagi "John" apabila anda memerlukan "John".
Gunakan Kes:
- Alamat e-mel (tiada ruang di belakang)
- Nama pengguna (tiada ruang kosong di hadapan)
- Kod rujukan (padanan tepat)
- Mana-mana bidang yang penting ketepatannya
Kebaikan:
Mengurangkan ralat pengguna, meningkatkan ketekalan data, mencegah masalah pengesahan dan memudahkan pemadanan dan pencarian.
🔒 Mod Kata Laluan
Pelindungan Input Selamat
Ubah mana-mana medan teks kepada medan kata laluan. Aksara dipaparkan sebagai titik (•••) untuk melindungi maklumat sensitif daripada pengguna yang tidak bertanggungjawab.
Perfect For:
- Entri kata laluan dan PIN
- Kod keselamatan dan token
- Nombor pengenalan sulit
- Kod pengesahan dua faktor
Tingkah Laku Pintar:
Mod kata laluan melumpuhkan ciri yang bercanggah seperti transformasi teks dan jenis input khas secara automatik untuk memastikan keselamatan.
📱 Jenis Input Pintar
Dioptimumkan untuk Mudah Alih & Desktop:
- Teks Biasa – Input teks standard untuk kegunaan umum
- Carian – Termasuk butang kosong terbina dalam (X) untuk tetapan semula pantas
- Telefon – Mencetuskan papan kekunci berangka pada peranti mudah alih untuk memudahkan kemasukan nombor telefon
- URL – Menunjukkan papan kekunci mudah alih khusus dengan pintasan .com, .org
Mengapa Ia Perkara:
Jenis input yang betul mempercepatkan kemasukan data pada mudah alih, mengurangkan ralat dan meningkatkan pengalaman pengguna merentasi semua peranti.
🎨 Transformasi Teks Automatik
Format Teks Seperti yang Ditaip Pengguna:
- Tiada Transformasi – Teks kekal seperti yang dimasukkan
- HURUF BESAR – Menukar semua teks kepada huruf besar (JOHN DOE)
- huruf kecil – Menukar semua teks kepada huruf kecil (john doe)
- Huruf Pertama Berbentuk Kapital – Hanya huruf pertama berhuruf besar (John doe)
- Huruf Pertama Setiap Perkataan (John Doe)
Perfect For:
- HURUF BESAR: Plat lesen, kod negeri, ID produk
- Huruf kecil: Alamat e-mel, nama pengguna
- Huruf besar: Ayat bermula, nama tunggal
- Kes Gelaran: Nama penuh, alamat, gelaran
Tingkah Laku Pintar:
Transformasi berlaku secara automatik semasa penyerahan sementara pengguna melihat input asal mereka.
🙈 Mod Medan Tersembunyi
Medan Data Tidak Kelihatan
Cipta medan yang tidak kelihatan kepada pengguna tetapi serahkan data bersama borang. Sesuai untuk penjejakan, kod rujukan dan nilai sistem.
Gunakan Kes:
- Parameter penjejakan UTM
- ID sumber rujukan
- Nombor versi borang
- Penanda cap waktu
- Metadata tersembunyi
Bagaimana Ia Berfungsi:
Tetapkan "Nilai Tersembunyi" dan ia akan disertakan secara automatik dalam setiap penyerahan borang tanpa mengganggu UI borang anda.
🔀 Logik Bersyarat
Keterlihatan Medan Dinamik
Tunjukkan atau sembunyikan medan teks berdasarkan nilai borang lain. Cipta borang pintar yang menyesuaikan diri dengan input pengguna.
Peraturan Logik Lanjutan:
- DAN Logik – Semua syarat mesti dipenuhi
- Logik ATAU – Sebarang keadaan boleh mencetuskan tindakan
- 8 Operator – Sama dengan, Tidak sama dengan, Lebih besar daripada, Kurang daripada, Mengandungi, Kosong dan lebih banyak lagi
Gunakan Kes:
- Tunjukkan “Nama syarikat” hanya apabila jenis pengguna bersamaan dengan “Perniagaan”
- Paparkan “Sumber rujukan” apabila “Bagaimana anda mengetahui tentang kami?” mengandungi “Rujukan”
- Sembunyikan "Butiran lain" apabila pilihan utama tidak kosong
- Dedahkan “Kod promosi” apabila nilai pesanan melebihi $100
🎯 Pengalaman Pengguna yang Dipertingkatkan
Ciri Pintar Terbina Dalam:
- Nilai Lalai – Isi medan terlebih dahulu untuk mempercepatkan penyiapan
- Teks Pemegang Tempat – Tunjukkan petua berguna sebelum pengguna menaip
- Teks Bantuan – Tambah penerangan untuk menjelaskan apa yang perlu dimasukkan
- Pengesahan Diperlukan – Pastikan medan wajib dengan penunjuk yang jelas
- Kelas CSS Tersuai – Gunakan penggayaan tersuai agar sepadan dengan jenama anda
- Sokongan Kebolehcapaian – Label ARIA untuk pembaca skrin
- Dioptimumkan Mudah Alih – Input mesra sentuh dengan papan kekunci yang sesuai
Persediaan Mudah dalam 3 Langkah
Sediakan Medan Input Teks anda dalam beberapa minit
Tambah Medan Teks
Seret dan lepas medan Input Teks daripada bahagian Medan Asas ke dalam borang anda.
Tetapkan Pengesahan & Had
Pilih jenis pengesahan (e-mel, URL, huruf, dll.), tetapkan had aksara minimum/maks dan secara pilihan dayakan mod kata laluan atau pemangkasan ruang kosong.
Konfigurasikan Pemformatan
Pilih jenis input untuk pengoptimuman mudah alih, pilih transformasi teks (huruf besar, huruf kecil, dsb.) dan tetapkan nilai lalai atau ruang letak.
🎉 Itu sahaja! Medan teks anda sudah siap dengan pengesahan dan pemformatan pintar.
Aplikasi Dunia Sebenar
Pendaftaran pengguna
* Medan nama pengguna dengan had panjang
* Input kata laluan dengan penyamaran
* Medan nama dengan pemformatan huruf besar/kecil tajuk
* Alamat e-mel dengan pengesahan
Borang Perhubungan
* Nama penuh dengan huruf besar/kecil
* Pengesahan e-mel
* Nombor telefon dengan input tel
* Medan mesej/komen
E-commerce
* Kemasukan kod promosi (huruf besar)
* Medan mesej hadiah
* Arahan khas
* Nota penghantaran
Aplikasi Perniagaan
* Nombor ID pekerja
* Nama Jabatan
* Nombor rujukan
* Kod dalaman
Permohonan & Pendaftaran
* Nombor lesen
* Kod pensijilan
* ID Keahlian
* Pengecam tersuai
Cari & Penapisan
* Input carian dengan butang kosong
* Tapis medan teks
* Entri kata kunci
* Input pertanyaan
Pilihan Medan Lengkap
Konfigurasi asas
- Label Medan – Tajuk yang ditunjukkan di atas medan teks
- Teks Penerangan/Bantuan – Panduan tambahan untuk pengguna
- Medan Wajib – Jadikan entri teks wajib
- Teks Pemegang Tempat – Teks petunjuk sebelum pengguna menaip
Pengesahan Panjang
- Panjang Minimum – Aksara paling sedikit dibenarkan (pengesahan)
- Panjang Maksimum – Kebanyakan aksara dibenarkan (had tetap)
Nilai Lalai
- Nilai Lalai – Teks yang telah diisi terlebih dahulu apabila borang dimuatkan
- Nilai Tersembunyi – Nilai untuk medan tersembunyi (apabila mod tersembunyi diaktifkan)
Keselamatan dan Privasi
- Medan Kata Laluan – Topeng input sebagai kata laluan (menunjukkan titik •••)
Medan Tersembunyi – Jadikan medan tidak kelihatan tetapi sertakan dalam penyerahan
Kualiti Data
Potong Ruang Putih – Alih keluar ruang tambahan dari awal dan akhir secara automatik
Peraturan Pengesahan
- Jenis Pengesahan
- Tiada (sebarang teks)
- E-mel ([e-mel dilindungi])
- URL (https://example.com)
- Huruf sahaja (AZ sahaja)
- Nombor sahaja (0-9 sahaja)
- Alfanumerik (AZ dan 0-9)
- Corak Tersuai (regex)
- Corak Tersuai – Ungkapan biasa untuk pengesahan tersuai (apabila “Tersuai” dipilih)
Jenis Input
- Jenis Input
- Teks Biasa
- Carian (dengan butang kosongkan)
- Telefon (papan kekunci berangka pada telefon bimbit)
- URL (papan kekunci mudah alih khusus)
Pemformatan Teks
- Transformasi Teks
- Tiada transformasi
- UPPERCASE
- huruf kecil
- Huruf Pertama Berbentuk Kapital
- Kes Tajuk
Logik Bersyarat
- Dayakan Logik Bersyarat – Tunjukkan/sembunyikan berdasarkan syarat
- Jenis Logik
- Semua syarat mesti dipenuhi (DAN)
- Sebarang syarat boleh dipenuhi (ATAU)
- Peraturan Keadaan
- Tunjukkan/Sembunyikan – Tindakan yang perlu diambil
- Medan – Medan yang hendak disemak
- Operator – Sama dengan, Tidak sama dengan, Mengandungi, Lebih besar daripada, Kurang daripada, Kosong, Tidak kosong
- Nilai – Nilai perbandingan
- Pelbagai Syarat – Tambah peraturan tanpa had
Pilihan Lanjutan
- Kelas CSS Tersuai – Gunakan penggayaan tersuai
- Atribut Kebolehcapaian – label dan perihalan ARIA
Mengapa Memilih Medan Input Teks Kami?
✅ Serbaguna – Berfungsi untuk nama, kod, kata laluan dan semua yang ada di antaranya
✅ Pengesahan Pintar – 6+ corak pengesahan serta regex tersuai
✅ Dioptimumkan Mudah Alih – Papan kekunci yang sesuai untuk setiap jenis input
✅ Pemformatan Automatik – Transformasi teks berlaku secara automatik
✅ Selamat – Mod kata laluan melindungi maklumat sensitif
✅ Data Bersih – Pemangkasan ruang kosong menghalang ralat biasa
✅ Fleksibel – Medan tersembunyi, nilai lalai, logik bersyarat
✅ Mesra Pengguna – Mesej pengesahan yang jelas membimbing pengguna
✅ Bersepadu Sepenuhnya – Berfungsi dengan lancar dengan semua ciri borang
Soalan Lazim
S: Apakah perbezaan antara panjang minimum/maksimum dan pengesahan?
Panjang minimum/maksimum mengawal bilangan aksara yang dibenarkan. Pengesahan mengawal aksara yang dibenarkan, seperti hanya huruf, hanya nombor atau format e-mel.
S: Bolehkah saya mengesahkan kedua-dua panjang DAN format?
Ya. Gabungkan panjang min/maks dengan peraturan pengesahan. Contohnya, tetapkan min 3, maks 15 dan pengesahan alfanumerik untuk medan nama pengguna.
S: Bagaimanakah mod kata laluan berfungsi?
Mod kata laluan menutup aksara dengan titik, sama seperti medan kata laluan biasa pada skrin log masuk.
S: Apakah fungsi “potong ruang kosong”?
Ia mengalih keluar ruang di hadapan dan di belakang sebelum penyerahan supaya ruang yang tidak disengajakan tidak mengganggu pengesahan.
S: Bolehkah saya mencipta corak pengesahan tersuai?
Ya. Gunakan “Corak Tersuai” dan tambahkan ungkapan biasa untuk menguatkuasakan sebarang struktur yang anda perlukan.
S: Bagaimanakah transformasi teks berfungsi?
Pengguna menaip seperti biasa dan sistem akan mengubah teks semasa penyerahan, seperti menukar kepada Huruf Besar atau HURUF BESAR.
S: Apakah jenis input carian untuknya?
Ia menambah butang kosong (X) terbina dalam supaya pengguna boleh menetapkan semula medan serta-merta semasa mencari.
S: Mengapa menggunakan jenis input “tel”?
Pada telefon bimbit, ia membuka pad kekunci berangka untuk memudahkan memasukkan digit gaya telefon.
S: Bolehkah saya menggunakan logik bersyarat dengan medan teks?
Ya. Syarat seperti “Mengandungi”, “Sama dengan”, atau “Kosong” membolehkan anda memaparkan atau menyembunyikan medan berdasarkan input pengguna.
S: Apakah kegunaan medan tersembunyi?
Ia menyimpan data tanpa kelihatan kepada pengguna, berguna untuk menjejaki metadata seperti tag UTM atau sumber rujukan.
S: Bolehkah medan teks digunakan untuk nombor?
Ya, tetapi gunakan medan Nombor untuk pengiraan atau pengesahan berangka. Gunakan Teks dengan “Nombor sahaja” apabila anda memerlukan kod atau ID yang tidak sepatutnya dianggap sebagai nombor.
S: Sejauh manakah corak regex boleh menjadi tepat?
Regex boleh menguatkuasakan corak yang sangat spesifik. Gunakan penguji regex jika anda perlu membina atau mengesahkan corak yang kompleks.
