Rumah > hujung hadapan web > tutorial js > 5 JQuery Validate Form Demo

5 JQuery Validate Form Demo

Lisa Kudrow
Lepaskan: 2025-02-22 10:03:14
asal
937 orang telah melayarinya

lima demo pengesahan bentuk jQuery yang sangat baik

Plugin pengesahan bentuk yang banyak disediakan, tetapi di sini terdapat lima demo berkuasa jQuery terkemuka yang mempamerkan teknik pengesahan bentuk yang berkesan.

5 Good jQuery Validate Form Demos Sumber & Demo 1: Plugin Pengesahan JQuery

Plugin ini memudahkan pengesahan borang pelanggan semasa menyediakan pilihan penyesuaian yang luas.

5 Good jQuery Validate Form Demos Sumber & Demo 2: Plugin Pengesahan JQuery - Themerollered

Demo yang menarik secara visual menggunakan tema Themeroller.

5 Good jQuery Validate Form Demos Sumber & Demo 3: JQuery Validate Demo dengan Twitter Bootstrap Styling

Demo ini mengintegrasikan plugin dengan rangka kerja Twitter Bootstrap yang popular untuk gaya yang dipertingkatkan.

5 Good jQuery Validate Form Demos Sumber & Demo 4: Borang Pengesahan JQuery Asas

Demo mudah yang menggambarkan kemudahan pengesahan bentuk dengan jQuery dan plugin pengesahannya, menggunakan peraturan pengesahan input asas.

5 Good jQuery Validate Form Demos Sumber & Demo 5: Contoh Pengesahan Borang Ajax

Demo ini membentangkan dua contoh pengesahan borang klien menggunakan JavaScript (dengan jQuery) dan Ajax untuk pemprosesan sisi pelayan.

Soalan Lazim (Soalan Lazim)

Menyesuaikan Mesej Ralat: Mudah menyesuaikan mesej ralat menggunakan pilihan messages dalam kaedah validate. Tentukan mesej tersuai untuk setiap bidang dan peraturan pengesahan. Contohnya:

$("#myForm").validate({
  rules: {
    name: {
      required: true,
      minlength: 2
    }
  },
  messages: {
    name: {
      required: "Please enter your name",
      minlength: "Name must be at least 2 characters"
    }
  }
});
Salin selepas log masuk

Pengesahan e-mel: Peraturan terbina dalam mengendalikan pengesahan e-mel. email

$("#myForm").validate({
  rules: {
    email: {
      required: true,
      email: true
    }
  }
});
Salin selepas log masuk

Pengesahan penyerahan borang: Kaedah secara automatik mengesahkan penyerahan. Cukup panggil validate pada borang anda. validate()

Integrasi Ajax: Gunakan pilihan untuk memproses penyerahan borang melalui Ajax. submitHandler

$("#myForm").validate({
  submitHandler: function(form) {
    $.ajax({
      type: "POST",
      url: "/submit",
      data: $(form).serialize(),
      success: function(response) {
        // Handle the response
      }
    });
    return false;
  }
});
Salin selepas log masuk

Mengesahkan kotak semak, pilih medan, medan berganda, input fail, nombor, dan tarikh: Peraturan berfungsi untuk kotak semak dan pilih medan. Fungsi boleh mengesahkan pelbagai bidang dengan nama yang sama. Peraturan required juga terpakai kepada input fail. Gunakan required dan number peraturan untuk pengesahan nombor dan tarikh masing -masing. Rujuk artikel asal untuk contoh terperinci masing -masing. date

Atas ialah kandungan terperinci 5 JQuery Validate Form Demo. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

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