cari
Rumahhujung hadapan webtutorial js10 plugin pengesahan borang jQuery

10 plugin pengesahan borang jQuery

Takeaways Key

HTML5 memperkenalkan atribut bentuk baru untuk pengesahan bentuk berasaskan pelayar, tetapi ia mempunyai sekatan seperti ketidakupayaan untuk menyesuaikan mesej dan gaya ralat, dan keperluan untuk membuat corak untuk medan input. Plugin Pengesahan Borang JQuery bertujuan untuk mengatasi batasan -batasan ini.
  • Artikel ini menyediakan senarai 10 plugin pengesahan bentuk jQuery popular, termasuk pasli, validator bentuk jQuery, plugin pengesahan jQuery, validator bootstrap, asap, formvalidation, validatr, validetta, jQuery.validity, dan h5validate. Setiap plugin mempunyai ciri dan keupayaan yang unik, seperti peraturan pengesahan tersuai, penyetempatan, pengesahan Ajax jauh, cadangan input, dan banyak lagi.
  • Plugin Pengesahan Borang JQuery berfungsi dengan memeriksa data yang dimasukkan dalam bidang borang terhadap peraturan yang telah ditetapkan. Mereka memberikan maklum balas segera mengenai kesilapan, yang membolehkan pengguna membetulkannya sebelum menyerahkan borang tersebut. Kebanyakan plugin membenarkan penyesuaian mesej ralat dan umumnya serasi dengan semua pelayar moden yang menyokong JavaScript dan jQuery.
  • Artikel popular ini dikemas kini pada 8 Ogos, 2016 untuk mencerminkan keadaan semasa plugin pengesahan bentuk. Komen yang berkaitan dengan artikel lama telah dipadam.
  • HTML5 memperkenalkan atribut bentuk baru supaya penyemak imbas dapat mengesahkan bentuk secara asli. Dengan CSS3 dan JavaScript anda dapat merealisasikan pengesahan bentuk asas tanpa memerlukan plugin - seperti yang diterangkan dalam artikel ini. Tetapi ini mempunyai beberapa sekatan:

Mesej ralat ditinggalkan kepada penyemak imbas itu sendiri, anda hanya boleh memberikan tajuk medan input
  • Anda tidak dapat menyesuaikan gaya mesej ralat
  • anda perlu membuat corak untuk medan input sendiri
  • Plugin pengesahan bentuk 10 jQuery berikut menetapkan matlamat untuk menyesuaikan mesej ralat dan gaya, serta memudahkan penciptaan peraturan pengesahan.

1. Parsley

Plugin extensible yang menawarkan pilihan biasa seperti penyetempatan dan peraturan pengesahan tersuai, tetapi juga pengesahan AJAX jauh. Dokumentasi ini bersih dan mudah dibaca dan projek itu dikekalkan secara aktif. Peraturan pengesahan boleh dikawal menggunakan borang HTML5 atau atribut data tersuai.

Lihat Demo Plugin Pen Parsley oleh SitePoint (@SitePoint) pada Codepen.

Laman web Kod sumber

2. Validator Borang JQuery

Plugin modular, yang menawarkan satu set asas peraturan pengesahan secara lalai dan membolehkan anda memuatkan modul lebih lanjut atas permintaan. Sebagai contoh: Pengesah fail semasa memuat naik fail, tetapi juga tarikh, keselamatan atau modul lokasi. Ia juga membolehkan anda memberikan cadangan input. Pengesahan dikawal dengan atribut data HTML5.

Lihat Demo Plugin Validator Form Pen JQuery oleh SitePoint (@SitePoint) pada codepen.

Laman web Kod sumber

3. plugin pengesahan jQuery

Salah satu plugin pengesahan pertama dari tahun 2006. Ia membolehkan anda menentukan peraturan pengesahan tersuai menggunakan atribut HTML5 atau objek JavaScript. Ia juga mempunyai banyak peraturan lalai yang dilaksanakan dan menawarkan API untuk membuat peraturan sendiri dengan mudah. Mencari maklumat terperinci mengenai plugin mungkin sukar pada mulanya dan ia terhad kepada JQuery 1.x, tetapi mereka berjanji untuk menjadikannya lebih baik - lihat kempen ini.

Lihat Demo Plugin Pengesahan Pen JQuery oleh SitePoint (@SitePoint) pada Codepen.

Laman web Kod sumber

4. Validator Bootstrap

plugin pengesahan jQuery untuk bootstrap. Ia pada dasarnya hanya pembungkus di sekitar pengesahan bentuk asli menggunakan atribut HTML5, tetapi juga boleh digunakan untuk menambah peraturan tersuai. Ia selalu menunjukkan mesej ralat dari penyemak imbas, diterjemahkan secara automatik ke dalam bahasa yang betul.

Lihat Demo Plugin Validator Pen Bootstrap oleh SitePoint (@SitePoint) pada codepen.

Laman web Kod sumber

5. Asap

Asap adalah koleksi komponen untuk bootstrap - termasuk validator bentuk. Sebagai perbandingan dengan validator bootstrap yang lain (#4), ia tidak menggunakan pengesahan penyemak imbas asli - oleh itu mesej ralat tidak secara automatik setempat dan peraturan pengesahan perlu ditentukan menggunakan atribut HTML5 dan data, serta JavaScript.

Lihat Demo Plugin Pengesahan Borang Pen Asap oleh SitePoint (@SitePoint) pada codepen.

Laman web Kod sumber

6. FormValidation

Plugin Pengesahan JQuery Premium dari 50 $ dengan integrasi terbina dalam untuk Bootstrap, Yayasan dan lain-lain. Ia mempunyai banyak peraturan pengesahan serta pilihan dan boleh menguntungkan untuk aplikasi dengan banyak bentuk kompleks.

10 plugin pengesahan borang jQuery Laman web

7. ValidAtr

Pembungkus yang sangat asas untuk pengesahan bentuk oleh penyemak imbas yang menggunakan mesej ralat asli di mana mungkin, dikawal dengan atribut bentuk HTML5. Ia boleh digunakan sebagai polyfill atau untuk menyesuaikan gaya mesej ralat. Tidak ada lagi, tidak kurang.

lihat demo plugin penagur pena oleh SitePoint (@SitePoint) pada codepen.

Laman web Kod sumber

8. Validetta

Plugin ini menawarkan pengesahan menggunakan atribut data, dengan pilihan yang agak terhad. Ia datang dengan hanya peraturan pengesahan asas, segala -galanya boleh ditambah dengan ungkapan biasa tersuai - tetapi tidak ada contoh yang menunjukkannya. Berbanding dengan plugin lain, satu -satunya ciri unik ialah mesej ralat dipaparkan dalam gelembung (lihat demo di bawah).

Lihat Demo Plugin Pen Validetta oleh SitePoint (@SitePoint) pada codepen.

Laman web Kod sumber

9. JQuery.Validity

Plugin untuk mengawal pengesahan dengan JavaScript sahaja - tiada atribut HTML5 atau data. Walaupun ini mungkin berguna untuk peraturan pengesahan dinamik, plugin tidak menawarkan pilihan yang cukup untuk membuat penulisan yang cekap. Ia juga tidak membenarkan menggunakan atribut jenis HTML5 baru seperti e -mel, dan tidak menyediakan fungsi untuk memeriksa sama ada borang yang sah - perlu untuk menunjukkan mesej kejayaan.

lihat pena jquery.validity plugin demo oleh SitePoint (@SitePoint) pada codepen.

Laman web Kod sumber

10. H5Validate

Plugin ini malangnya telah ditinggalkan oleh penciptanya (Eric Elliott). Akibatnya, laman web demo/dokumentasi mengembalikan 404 dan terdapat dua dozen isu terbuka. Plugin tidak secara automatik mengesahkan input mengikut jenis dan contoh berikut walaupun tidak menunjukkan mesej ralat. Kami telah memasukkannya ke dalam senarai itu, kerana Eric sedang mencari penyelenggara baru untuk projek itu, jadi ada kemungkinan bahawa pada satu ketika di masa depan, ia mungkin mendapat sedikit kehidupan semula jadi.

Lihat Demo Plugin Pen H5Validate oleh SitePoint (@SitePoint) pada codepen.

kod sumber

Kesimpulan

Nah, itulah sepuluh senarai teratas plugin pengesahan bentuk jQuery popular. Sekiranya anda mempunyai pengalaman dengan ini (baik atau buruk!), Atau jika anda tahu mengenai plugin pengesahan bentuk lain yang patut disebut, sila beritahu kami dalam komen!

Soalan Lazim (Soalan Lazim) Mengenai Plugin Pengesahan Borang JQuery

Apakah plugin pengesahan bentuk jQuery? Mereka memastikan bahawa data yang dimasukkan oleh pengguna adalah betul dan dalam format yang diperlukan sebelum diserahkan kepada pelayan. Plugin ini dibina menggunakan JQuery, perpustakaan JavaScript yang cepat, kecil, dan kaya. Mereka menyediakan cara yang mudah dan cekap untuk mengesahkan bidang bentuk, mengurangkan jumlah pengekodan manual yang diperlukan.

Bagaimana Plugin Pengesahan Borang JQuery berfungsi? Peraturan ini boleh termasuk cek untuk medan yang diperlukan, alamat e -mel yang sah, kata laluan yang sepadan, panjang minimum dan maksimum input, dan sebagainya. Sekiranya data yang dimasukkan tidak memenuhi peraturan ini, plugin memaparkan mesej ralat, menghalang borang daripada diserahkan sehingga kesilapan diperbetulkan. Menggunakan plugin pengesahan bentuk jQuery boleh memudahkan proses pengesahan borang. Mereka menyelamatkan anda daripada menulis kod JavaScript yang kompleks untuk mengesahkan setiap medan borang secara individu. Mereka juga menyediakan cara yang konsisten untuk mengendalikan pengesahan bentuk di seluruh pelayar dan peranti yang berbeza. Selain itu, mereka meningkatkan pengalaman pengguna dengan memberikan maklum balas segera mengenai sebarang kesilapan, yang membolehkan pengguna membetulkannya sebelum menyerahkan borang. Plugin Pengesahan Borang JQuery, anda perlu memasukkan perpustakaan jQuery di laman web anda. Kemudian, anda boleh memuat turun plugin dan memasukkannya ke dalam laman web anda menggunakan tag skrip. Sesetengah plugin juga mungkin memerlukan fail CSS tambahan untuk dimasukkan untuk menggayakan mesej ralat. membolehkan anda menyesuaikan mesej ralat. Anda boleh menukar teks mesej, gaya di mana ia dipaparkan, dan juga bahasa di mana mereka ditulis. Ini membolehkan anda menyesuaikan mesej ralat kepada keperluan khusus anda dan bahasa dan budaya pengguna anda. Sesuai dengan semua pelayar moden yang menyokong JavaScript dan jQuery. Walau bagaimanapun, tahap keserasian mungkin berbeza antara plugin yang berbeza dan versi yang berbeza dari plugin yang sama. Adalah idea yang baik untuk menguji plugin dalam penyemak imbas yang berbeza untuk memastikan ia berfungsi seperti yang diharapkan. Mungkin untuk menggunakan pelbagai plugin pengesahan bentuk jQuery pada halaman web yang sama, ia biasanya tidak disyorkan. Menggunakan pelbagai plugin boleh membawa kepada konflik dan boleh membuat halaman web lebih perlahan untuk memuat dan bertindak balas. Biasanya lebih baik memilih satu plugin yang memenuhi semua keperluan anda dan berpegang teguh dengannya. Muat turun versi terkini plugin dan gantikan fail lama dengan yang baru. Sesetengah plugin juga boleh menyediakan fungsi kemas kini yang secara automatik memuat turun dan memasang versi terkini.

Atas ialah kandungan terperinci 10 plugin pengesahan borang jQuery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan
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
C dan JavaScript: Sambungan dijelaskanC dan JavaScript: Sambungan dijelaskanApr 23, 2025 am 12:07 AM

C dan JavaScript mencapai interoperabilitas melalui webassembly. 1) Kod C disusun ke dalam modul WebAssembly dan diperkenalkan ke dalam persekitaran JavaScript untuk meningkatkan kuasa pengkomputeran. 2) Dalam pembangunan permainan, C mengendalikan enjin fizik dan rendering grafik, dan JavaScript bertanggungjawab untuk logik permainan dan antara muka pengguna.

Dari laman web ke aplikasi: Aplikasi pelbagai JavaScriptDari laman web ke aplikasi: Aplikasi pelbagai JavaScriptApr 22, 2025 am 12:02 AM

JavaScript digunakan secara meluas di laman web, aplikasi mudah alih, aplikasi desktop dan pengaturcaraan sisi pelayan. 1) Dalam pembangunan laman web, JavaScript mengendalikan DOM bersama -sama dengan HTML dan CSS untuk mencapai kesan dinamik dan menyokong rangka kerja seperti JQuery dan React. 2) Melalui reaktnatif dan ionik, JavaScript digunakan untuk membangunkan aplikasi mudah alih rentas platform. 3) Rangka kerja elektron membolehkan JavaScript membina aplikasi desktop. 4) Node.js membolehkan JavaScript berjalan di sisi pelayan dan menyokong permintaan serentak yang tinggi.

Python vs JavaScript: Gunakan Kes dan Aplikasi MembandingkanPython vs JavaScript: Gunakan Kes dan Aplikasi MembandingkanApr 21, 2025 am 12:01 AM

Python lebih sesuai untuk sains data dan automasi, manakala JavaScript lebih sesuai untuk pembangunan front-end dan penuh. 1. Python berfungsi dengan baik dalam sains data dan pembelajaran mesin, menggunakan perpustakaan seperti numpy dan panda untuk pemprosesan data dan pemodelan. 2. Python adalah ringkas dan cekap dalam automasi dan skrip. 3. JavaScript sangat diperlukan dalam pembangunan front-end dan digunakan untuk membina laman web dinamik dan aplikasi satu halaman. 4. JavaScript memainkan peranan dalam pembangunan back-end melalui Node.js dan menyokong pembangunan stack penuh.

Peranan C/C dalam JavaScript Jurubah dan PenyusunPeranan C/C dalam JavaScript Jurubah dan PenyusunApr 20, 2025 am 12:01 AM

C dan C memainkan peranan penting dalam enjin JavaScript, terutamanya digunakan untuk melaksanakan jurubahasa dan penyusun JIT. 1) C digunakan untuk menghuraikan kod sumber JavaScript dan menghasilkan pokok sintaks abstrak. 2) C bertanggungjawab untuk menjana dan melaksanakan bytecode. 3) C melaksanakan pengkompil JIT, mengoptimumkan dan menyusun kod hot-spot semasa runtime, dan dengan ketara meningkatkan kecekapan pelaksanaan JavaScript.

JavaScript in Action: Contoh dan projek dunia nyataJavaScript in Action: Contoh dan projek dunia nyataApr 19, 2025 am 12:13 AM

Aplikasi JavaScript di dunia nyata termasuk pembangunan depan dan back-end. 1) Memaparkan aplikasi front-end dengan membina aplikasi senarai TODO, yang melibatkan operasi DOM dan pemprosesan acara. 2) Membina Restfulapi melalui Node.js dan menyatakan untuk menunjukkan aplikasi back-end.

JavaScript dan Web: Fungsi teras dan kes penggunaanJavaScript dan Web: Fungsi teras dan kes penggunaanApr 18, 2025 am 12:19 AM

Penggunaan utama JavaScript dalam pembangunan web termasuk interaksi klien, pengesahan bentuk dan komunikasi tak segerak. 1) kemas kini kandungan dinamik dan interaksi pengguna melalui operasi DOM; 2) pengesahan pelanggan dijalankan sebelum pengguna mengemukakan data untuk meningkatkan pengalaman pengguna; 3) Komunikasi yang tidak bersesuaian dengan pelayan dicapai melalui teknologi Ajax.

Memahami Enjin JavaScript: Butiran PelaksanaanMemahami Enjin JavaScript: Butiran PelaksanaanApr 17, 2025 am 12:05 AM

Memahami bagaimana enjin JavaScript berfungsi secara dalaman adalah penting kepada pemaju kerana ia membantu menulis kod yang lebih cekap dan memahami kesesakan prestasi dan strategi pengoptimuman. 1) aliran kerja enjin termasuk tiga peringkat: parsing, penyusun dan pelaksanaan; 2) Semasa proses pelaksanaan, enjin akan melakukan pengoptimuman dinamik, seperti cache dalam talian dan kelas tersembunyi; 3) Amalan terbaik termasuk mengelakkan pembolehubah global, mengoptimumkan gelung, menggunakan const dan membiarkan, dan mengelakkan penggunaan penutupan yang berlebihan.

Python vs JavaScript: Keluk Pembelajaran dan Kemudahan PenggunaanPython vs JavaScript: Keluk Pembelajaran dan Kemudahan PenggunaanApr 16, 2025 am 12:12 AM

Python lebih sesuai untuk pemula, dengan lengkung pembelajaran yang lancar dan sintaks ringkas; JavaScript sesuai untuk pembangunan front-end, dengan lengkung pembelajaran yang curam dan sintaks yang fleksibel. 1. Sintaks Python adalah intuitif dan sesuai untuk sains data dan pembangunan back-end. 2. JavaScript adalah fleksibel dan digunakan secara meluas dalam pengaturcaraan depan dan pelayan.

See all articles

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Persekitaran pembangunan bersepadu PHP yang berkuasa

mPDF

mPDF

mPDF ialah perpustakaan PHP yang boleh menjana fail PDF daripada HTML yang dikodkan UTF-8. Pengarang asal, Ian Back, menulis mPDF untuk mengeluarkan fail PDF "dengan cepat" dari tapak webnya dan mengendalikan bahasa yang berbeza. Ia lebih perlahan dan menghasilkan fail yang lebih besar apabila menggunakan fon Unicode daripada skrip asal seperti HTML2FPDF, tetapi menyokong gaya CSS dsb. dan mempunyai banyak peningkatan. Menyokong hampir semua bahasa, termasuk RTL (Arab dan Ibrani) dan CJK (Cina, Jepun dan Korea). Menyokong elemen peringkat blok bersarang (seperti P, DIV),

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

PhpStorm versi Mac

PhpStorm versi Mac

Alat pembangunan bersepadu PHP profesional terkini (2018.2.1).

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual