Rumah > hujung hadapan web > tutorial js > jquery pelaksanaan tetap validation_jquery borang bersatu

jquery pelaksanaan tetap validation_jquery borang bersatu

WBOY
Lepaskan: 2016-05-16 15:38:43
asal
1014 orang telah melayarinya

Pengesahan borang sentiasa menyusahkan, terutamanya untuk borang yang lebih besar Jika anda menulis pengesahan berasingan untuk setiap input, ia akan menjadi pukulan maut Baru-baru ini, saya menulis sekeping js untuk mengesahkan sama ada kandungan borang itu betul .

Menggunakan kod ini, anda tidak perlu lagi menulis pertimbangan format untuk setiap input Anda hanya perlu menulis format ungkapan biasa yang betul dalam jenis data Butang hantar borang hanya perlu diikat pada fungsi semak.

Jika anda mempunyai sebarang cadangan, sila komen

<input type="text" datatype=“正则”/>

//表单验证
//点击下一步事件
function checkForm(form){
var success = true;
$("."+form+" input").each(function(){
var $that = $(this);
var dataType = eval($that.attr("dataType"));
if(dataType!=undefined){
if($that.val().match(dataType)){
$that.removeClass("borderRed");
}else{
$that.focus();
$that.addClass("borderRed");
success = false;
return false;
}
}
})
return success;
}

//给每个带有datatype属性的标签绑定blur focus事件

$(document).on("blur","input",function(){
var $that = $(this);
var dataType = eval($that.attr("dataType"));
if(dataType!=undefined){
if($that.val().match(dataType)){
$that.removeClass("borderRed");
}else{
$that.addClass("borderRed");
}
}
})
$(document).on("focus","input",function(){
$(this).removeClass("borderRed");
});
Salin selepas log masuk

Kandungan di atas telah berkongsi dengan anda cara melaksanakan pengesahan borang bersatu menggunakan keteraturan jquery saya harap anda menyukainya.

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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan