Rumah hujung hadapan web tutorial js Kaedah universal terkapsul untuk mengesan kemahiran forms_javascript

Kaedah universal terkapsul untuk mengesan kemahiran forms_javascript

May 16, 2016 pm 04:18 PM
enkapsulasi Pengesanan bentuk

Kesan pengesahan bahawa borang tidak boleh kosong (.notnull)

Fungsi: Apabila terdapat berbilang (termasuk satu) borang di bawah sepasang teg borang yang perlu diserahkan, gunakan js untuk menilai dengan tepat butang semasa dan elemen tersebut

Penggunaan: Cari bekas borang semasa di bawah teg borang dan berikannya class="form", dan butang hantar borang semasa diberikan class="check"
Elemen yang perlu disahkan sebagai kosong diberi class="notnull" nullmsg="xx tidak boleh kosong, dan borang yang memerlukan pertimbangan logik diberi class="need"
Jenis penghakiman diberikan class="num" (hanya boleh menjadi nombor) logicmsg segera pengesahan="XX hanya boleh menjadi nombor"

Berikan class="errorMessage" untuk memaparkan blok mesej ralat
Beri class="warn" untuk memaparkan mesej ralat
Tidak menggunakan pengaturcaraan berorientasikan objek js
Pertimbangan logik, jangan masukkan pengecam keperluan, terus berikan atribut ungkapan biasa (custom) regex="/^d$/" untuk membuat pertimbangan

Dilaksanakan secara luaran
Fungsi panggil balik butang Global.submitCallback
Global.confirmCallback mengesahkan fungsi panggil balik;
Bidang untuk penambahbaikan:
Tiada

Salin kod Kod adalah seperti berikut:

///
*/
//$(dokumen).sedia(
// fungsi () {
//        $("form").find(".notnull").bind({
//            fokus: fungsi () {
//                       jika ($(this).attr("value") == this.defaultValue) {
//                         $(this).attr("value", "");
//               }
//            },
//            kabur: fungsi () {
//                   jika ($(ini).attr("nilai") == "") {
//                                                                $(this).attr("value", this.defaultValue);
//               }
//           }
//       });
// }
//);
///*Kaedah untuk merangkum borang pengesanan universal*/
///event.srcElement: Objek sasaran yang mencetuskan acara, selalunya digunakan untuk acara onclick.
///event.fromElement: Sumber objek yang mencetuskan acara, selalunya digunakan untuk acara onmouseout dan onmouseover.
///event.toElement: Sumber sasaran yang mana tetikus bergerak selepas peristiwa dicetuskan. Ia sering digunakan untuk acara onmouseout dan onmouseover.
fungsi Global() {
var _self = ini;
}
Global.submitCallback = null;
Global.confirmCallback = null;
$(dokumen).sedia(fungsi () {
//membentuk badan
$("badan").cari(".bentuk").setiap(fungsi () {
This.onclick = fungsi (e) {
          butang var = batal;
             cuba {
                               butang = e.srcElement == null ? document.activeElement : e.srcElement;
              } tangkapan (e) {
console.log(e.message)
                        butang = document.activeElement;
            }
Jika ($(butang).is(".semak")) {
                        //makluman("serahkan")
                  var sub = (borang semak(ini) && SemakInputRex(ini) && semakpilih(ini) && semakSemak(ini));
                       jika (sub) {
// Panggil panggil balik kami, tetapi gunakan contoh kami sendiri sebagai konteks
Global.submitCallback.call(ini, [e]);
                }
                   sub kembali;
                } lain jika ($(butang).is(".confirm")) {
//alert("delete")
              var sub = confirm($(button).attr("title"));
                       jika (sub) {
Global.confirmCallback.call(ini, [e]);
                }
                   sub kembali;
              } lain {
                                                                                                                                                                                                                                                                                                                             kembali benar;
            }
}
});
/*Kesan elemen yang tidak boleh kosong dalam borang*/
Borang semak fungsi(borang) {
        var b = benar;
$(form).cari(".notnull").setiap(fungsi () {
Jika ($.trim($(this).val()).length <= 0) {//|| $(this).val() == this.defaultValue
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          melalui                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             // //alert($(this).attr("msg"))
                   $(this).parents(".form").find(".warn").text($(this).attr("nullmsg"));
$(this).parents(".form").find(".errorMessage").show();
                     $(this).select();
                    $(ini).fokus();
                   pulangan b = palsu;
            }
});
Jika (b == benar) {
                $(form). find(".warn").text("");
                $(form).find(".errorMessage").hide();
}
         kembali b;
}
/*Senarai lungsur turun yang diperlukan dalam borang pengesanan*/
Fungsi semakpilih(borang) {
      var b = benar;
           $(form). cari(".pilih").setiap(fungsi (i) {
              var ck = $(this).find('option:selected').text();
Jika (ck.indexOf("select") > -1) {
                   $(this).parents(".form").find(".warn").text($(this).attr("nullmsg"));
$(this).parents(".form").find(".errorMessage").show();
                     $(this).select();
                    $(ini).fokus();
                   pulangan b = palsu;
            }
});
         kembali b;
}
/*Semak kotak semak yang diperlukan dalam borang*/
Semakan fungsiDisemak(borang) {
      var b = benar;
$(form).cari(".kotak semak").setiap(fungsi (i) {
              var ck = $(this)[0].ditanda;
                jika (!ck) {
                   $(this).parents(".form").find(".warn").text($(this).attr("nullmsg"));
$(this).parents(".form").find(".errorMessage").show();
                     $(this).select();
                    $(ini).fokus();
                   pulangan b = palsu;
            }
});
         kembali b;
}
//Semak sama ada ia sepadan dengan ungkapan biasa
Fungsi GetFlase(nilai, reg, ele) {
Jika (reg.test(value)) {
             kembali benar;
}
           $(ele). ibu bapa(".form").find(".warn").text($(ele).attr("logicmsg"));
​​​​ $(ele). ibu bapa(".form").find(".errorMessage").show();
          $(ele).fokus();
          $(ele).select();
          mengembalikan palsu; //Tidak boleh menyerahkan
}
Fungsi CheckInputRex(borang) {
      var b = benar;
          $(form). find("input[type='text']").setiap(fungsi () {
Jika (jenis ($(ini).attr("regex")) == 'rentetan') {
Jika ($.trim($(this).val()).panjang > 0 && $(this).val() != this.defaultValue) {
//Nilai bentuk semasa
                      nilai var = $(this).attr("value") || $(this).val();
                  var regx = eval($(this).attr("regex"));
                           pulangan b = GetFlase(nilai, regx, ini);
                }
            }
});
         kembali b;
}
///Semak sama ada aksara sepadan yang dimasukkan oleh pengguna adalah sah
///Kaedah ini sudah lapuk
Fungsi SemakInput(borang) {
      var b = benar;
           $(form).cari(".perlu").setiap(fungsi () {
Jika ($.trim($(this).val()).panjang > 0 && $(this).val() != this.defaultValue) {
//Nilai bentuk semasa
              nilai var = $(this).attr("nilai");
                         //Nilai id atau nilai atribut nama adalah seperti: [name="contact"]
              var name = $(this).attr("class");
                                 // Semak sama ada kandungan yang hendak dimasukkan adalah sah, seperti: Maklumat hubungan
              var len = name.split(" ");
untuk (var i = 0; i < len.length; i ) {
suis ($.trim(len[i])) {
                                                                                                                                                                                                                                                                                                                                                                                                                                                 kes "mudah alih":
                                                                                                                                                                                                                                                                                                                                                                                                                                                                         var reg = /^1d{10}$/;
Pulangan b = GetFlase(nilai, reg, ini);
rehat;
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         kes "e-mel":
var reg = /^[w-] (.[w-] )*@[w-] (.[w-] ) $/;
Pulangan b = GetFlase(nilai, reg, ini);
rehat;
///Adakah kedua-dua kata laluan itu konsisten?                                                                                              kes "kata laluan":
rehat;
kes "kata laluan2":
Jika ($("#kata laluan").attr("nilai") != $("#kata laluan2").attr("nilai")) {
                                                                                                                   $(this).parents(".form").find(".warn").text($(this).attr("logicmsg"));
$(this).parents(".form").find(".errorMessage").show();
Pulangan b = palsu; // tidak boleh diserahkan
                                                                                                                                                        rehat;
kes "worktel":
                            sarung "hometel": //Nombor telefon rumah
                                                                                                                                                                                                                                                                                                                                                                                                                                                                           var reg = /^d{8}$/;
Pulangan b = GetFlase(nilai, reg, ini);
rehat;
                          huruf "siaran": //Poskod
                                            var reg = /^d{6}$/;
Pulangan b = GetFlase(nilai, reg, ini);
rehat;
"bonus" kes:
kes "elaun":
kes "Gaji Tetap":
var reg = /^-?([1-9]d*.d*|0.d*[1-9]d*|0?.0 |0|[1-9]d)$/;
Pulangan b = GetFlase(nilai, reg, ini);
rehat;
"identiti" kes:
                             var reg = /(^d{15}$)|(^d{18}$)|(^d{17}(d|X|x)$)/;
Pulangan b = GetFlase(nilai, reg, ini);
                            rehat;
                        kes "ketinggian":
                            var reg = /^[1-2][0-9][0-9]$/;
                            return b = GetFlase(nilai, reg, ini);
                            rehat;
                        kes "qq":
                            var reg = /^[1-9][0-9]{4,}$/;
                            return b = GetFlase(nilai, reg, ini);
                            rehat;
                        kes "masa mula":
                        kes "masa tamat":
                            var reg = /^d{4}$/;
                            if (reg.test(value) && (parseInt($(".endtime").val()) > parseInt($(".begintime").val()))) {
                                kembali b;
                            }
                            $.ligerDialog.alert($(this).attr("msg"))
                            $(this).select(); //获取焦点
                            pulangan b = palsu; //不能提交
                            rehat;
                        kes "bilangan":
                            var reg = /^d $/;
                            return b = GetFlase(nilai, reg, ini);
                            rehat;
                        ///大陆去香港需要办理往来港澳通行证和香港的签注.因私普通护照号码 护照号码 澳通行证和香港的签注.因私普通护照号码 护照号码 护照号码                                                                                                
///14/15 7 digit, G 8 digit; ///Yang biasa ialah: P. 7 digit; ///Untuk tujuan rasmi: S. 7 digit atau //S 8 digit, bermula dengan D ialah pasport diplomatik                               kes "posport": //Nombor pasport
                               var reg = /^(Pd{7}|Gd{8}|Sd{7,8}|Dd |1[4,5]d{7})$/;
Pulangan b = GetFlase(nilai, reg, ini);
rehat;
kes "akaun bank":
                                    var reg = /^[0-9]{19}$/;
Pulangan b = GetFlase(nilai, reg, ini);
rehat;
                            } //suis
                                                    //untuk
            }
});
         kembali b;
}
///Kaedah ini telah ditamatkan
});
///Klik untuk menukar warna latar belakang
$(dokumen).sedia(fungsi () {
var inputs = $("#top>.c>input");
$(input).setiap(fungsi () {
This.onclick = fungsi () {
               document.getElementById("utama").style.backgroundColor = this.name;
                    //$("#utama").Warna latar = this.name;
}
});
});



Kod di atas ialah kaedah pengesanan bentuk universal yang dirangkumkan saya harap anda semua menyukainya
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

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

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
2 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Cara mendapatkan biji gergasi
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Muzium Dua Point: Semua Pameran dan Di Mana Mencari Mereka
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Bagaimana untuk melaksanakan lompat halaman selepas penyerahan borang PHP Bagaimana untuk melaksanakan lompat halaman selepas penyerahan borang PHP Aug 12, 2023 am 11:30 AM

Cara melaksanakan lompat halaman selepas penyerahan borang PHP [Pengenalan] Dalam pembangunan web, penyerahan borang adalah keperluan fungsian biasa. Selepas pengguna mengisi borang dan mengklik butang hantar, data borang biasanya perlu dihantar ke pelayan untuk diproses, dan pengguna dialihkan ke halaman lain selepas diproses. Artikel ini akan memperkenalkan cara menggunakan PHP untuk melaksanakan lompatan halaman selepas penyerahan borang. [Langkah 1: Borang HTML] Pertama, kita perlu menulis halaman yang mengandungi borang dalam halaman HTML supaya pengguna boleh mengisi data yang perlu dihantar.

Penyelesaian kepada i7-7700 tidak dapat menaik taraf kepada Windows 11 Penyelesaian kepada i7-7700 tidak dapat menaik taraf kepada Windows 11 Dec 26, 2023 pm 06:52 PM

Prestasi i77700 adalah mencukupi untuk menjalankan win11, tetapi pengguna mendapati bahawa i77700 mereka tidak boleh dinaik taraf kepada win11 Ini terutamanya disebabkan oleh sekatan yang dikenakan oleh Microsoft, jadi mereka boleh memasangnya selagi mereka melangkau sekatan ini. i77700 tidak boleh dinaik taraf kepada win11: 1. Kerana Microsoft mengehadkan versi CPU. 2. Hanya Intel generasi kelapan dan versi ke atas boleh terus menaik taraf kepada win11 3. Sebagai generasi ke-7, i77700 tidak dapat memenuhi keperluan naik taraf win11. 4. Walau bagaimanapun, i77700 benar-benar mampu menggunakan win11 dengan lancar dari segi prestasi. 5. Jadi anda boleh menggunakan sistem pemasangan langsung win11 laman web ini. 6. Selepas muat turun selesai, klik kanan fail dan "muat"nya. 7. Klik dua kali untuk menjalankan "Satu klik

Karya terbaharu MIT: menggunakan GPT-3.5 untuk menyelesaikan masalah pengesanan anomali siri masa Karya terbaharu MIT: menggunakan GPT-3.5 untuk menyelesaikan masalah pengesanan anomali siri masa Jun 08, 2024 pm 06:09 PM

Hari ini saya ingin memperkenalkan kepada anda artikel yang diterbitkan oleh MIT minggu lepas, menggunakan GPT-3.5-turbo untuk menyelesaikan masalah pengesanan anomali siri masa, dan pada mulanya mengesahkan keberkesanan LLM dalam pengesanan anomali siri masa. Tiada penalaan dalam keseluruhan proses, dan GPT-3.5-turbo digunakan secara langsung untuk pengesanan anomali Inti artikel ini ialah cara menukar siri masa kepada input yang boleh dikenali oleh GPT-3.5-turbo, dan cara mereka bentuk. gesaan atau saluran paip untuk membenarkan LLM menyelesaikan tugas pengesanan anomali. Izinkan saya memperkenalkan karya ini kepada anda secara terperinci. Tajuk kertas imej: Largelanguagemodelscanbezero-shotanomalydete

Cara mengendalikan pengurusan hak pengguna dalam borang PHP Cara mengendalikan pengurusan hak pengguna dalam borang PHP Aug 10, 2023 pm 01:06 PM

Cara mengendalikan pengurusan hak pengguna dalam bentuk PHP Dengan pembangunan berterusan aplikasi web, pengurusan hak pengguna adalah salah satu fungsi penting. Pengurusan hak pengguna boleh mengawal hak operasi pengguna dalam aplikasi dan memastikan keselamatan dan kesahihan data. Dalam bentuk PHP, pengurusan hak pengguna boleh dilaksanakan melalui beberapa kod mudah. Artikel ini akan memperkenalkan cara mengendalikan pengurusan hak pengguna dalam borang PHP dan memberikan contoh kod yang sepadan. 1. Definisi dan pengurusan peranan pengguna Pertama sekali, mentakrif dan mengurus peranan pengguna adalah soal hak pengguna.

Bagaimana untuk menggunakan JavaScript untuk melaksanakan pengesahan masa nyata kandungan kotak input borang? Bagaimana untuk menggunakan JavaScript untuk melaksanakan pengesahan masa nyata kandungan kotak input borang? Oct 18, 2023 am 08:47 AM

Bagaimana untuk menggunakan JavaScript untuk melaksanakan pengesahan masa nyata kandungan kotak input borang? Dalam kebanyakan aplikasi web, borang ialah cara interaksi yang paling biasa antara pengguna dan sistem. Walau bagaimanapun, kandungan yang dimasukkan oleh pengguna selalunya perlu disahkan untuk memastikan ketepatan dan kesempurnaan data. Dalam artikel ini, kami akan mempelajari cara menggunakan JavaScript untuk melaksanakan pengesahan masa nyata kandungan kotak input borang dan memberikan contoh kod khusus. Mencipta borang Mula-mula kita perlu mencipta jadual ringkas dalam HTML

TrendForce: Produk platform Blackwell Nvidia memacu kapasiti pengeluaran CoWoS TSMC untuk meningkat sebanyak 150% tahun ini TrendForce: Produk platform Blackwell Nvidia memacu kapasiti pengeluaran CoWoS TSMC untuk meningkat sebanyak 150% tahun ini Apr 17, 2024 pm 08:00 PM

Menurut berita dari laman web ini pada 17 April, TrendForce baru-baru ini mengeluarkan laporan, mempercayai bahawa permintaan untuk produk platform Blackwell baharu Nvidia adalah menaik, dan dijangka memacu jumlah kapasiti pengeluaran pembungkusan CoWoS TSMC meningkat lebih daripada 150% pada 2024. Produk platform baharu NVIDIA Blackwell termasuk GPU siri B dan kad pemecut GB200 yang menyepadukan CPU GraceArm NVIDIA sendiri. TrendForce mengesahkan bahawa rantaian bekalan pada masa ini sangat optimistik tentang GB200, dengan penghantaran dijangka melebihi satu juta unit pada 2025, menyumbang 40-50% daripada GPU mewah Nvidia. Nvidia merancang untuk menyampaikan produk seperti GB200 dan B100 pada separuh kedua tahun ini, tetapi pembungkusan wafer huluan mesti terus menggunakan produk yang lebih kompleks.

Algoritma pengesanan yang dipertingkatkan: untuk pengesanan sasaran dalam imej penderiaan jauh optik resolusi tinggi Algoritma pengesanan yang dipertingkatkan: untuk pengesanan sasaran dalam imej penderiaan jauh optik resolusi tinggi Jun 06, 2024 pm 12:33 PM

01Garis prospek Pada masa ini, sukar untuk mencapai keseimbangan yang sesuai antara kecekapan pengesanan dan hasil pengesanan. Kami telah membangunkan algoritma YOLOv5 yang dipertingkatkan untuk pengesanan sasaran dalam imej penderiaan jauh optik resolusi tinggi, menggunakan piramid ciri berbilang lapisan, strategi kepala pengesanan berbilang dan modul perhatian hibrid untuk meningkatkan kesan rangkaian pengesanan sasaran dalam imej penderiaan jauh optik. Menurut set data SIMD, peta algoritma baharu adalah 2.2% lebih baik daripada YOLOv5 dan 8.48% lebih baik daripada YOLOX, mencapai keseimbangan yang lebih baik antara hasil pengesanan dan kelajuan. 02 Latar Belakang & Motivasi Dengan perkembangan pesat teknologi penderiaan jauh, imej penderiaan jauh optik resolusi tinggi telah digunakan untuk menggambarkan banyak objek di permukaan bumi, termasuk pesawat, kereta, bangunan, dll. Pengesanan objek dalam tafsiran imej penderiaan jauh

Bagaimana untuk menggunakan JavaScript untuk merealisasikan fungsi gesaan automatik kandungan kotak input borang? Bagaimana untuk menggunakan JavaScript untuk merealisasikan fungsi gesaan automatik kandungan kotak input borang? Oct 20, 2023 pm 04:01 PM

Bagaimana untuk menggunakan JavaScript untuk merealisasikan fungsi gesaan automatik kandungan kotak input borang? Pengenalan: Fungsi gesaan automatik kandungan kotak input borang adalah sangat biasa dalam aplikasi web Ia boleh membantu pengguna memasukkan kandungan yang betul dengan cepat. Artikel ini akan memperkenalkan cara menggunakan JavaScript untuk mencapai fungsi ini dan menyediakan contoh kod khusus. Cipta struktur HTML Mula-mula, kita perlu mencipta struktur HTML yang mengandungi kotak input dan senarai cadangan automatik. Anda boleh menggunakan kod berikut: &lt;!DOCTYP

See all articles