>웹 프론트엔드 >JS 튜토리얼 >jquery는 통합 양식의 정규 구현입니다.

jquery는 통합 양식의 정규 구현입니다.

WBOY
WBOY원래의
2016-05-16 15:38:431024검색

양식 확인은 항상 매우 번거롭습니다. 특히 각 입력에 대해 별도의 확인을 작성하면 치명적인 타격이 될 것입니다. 최근에는 양식 내용이 올바른지 확인하기 위해 짧은 js를 작성했습니다. .

이 코드를 사용하면 더 이상 각 입력에 대한 형식 판단을 작성할 필요가 없습니다. 데이터 유형에 올바른 형식의 정규 표현식만 작성하면 됩니다. 양식 제출 버튼만 checkForm 함수에 바인딩하면 됩니다.

제안사항이 있으시면 댓글 달아주세요

<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");
});

위 콘텐츠에서는 jquery 규칙성을 사용하여 통합 양식 유효성 검사를 구현하는 방법을 공유했습니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.