ホームページ > ウェブフロントエンド > jsチュートリアル > バリデーター検証コントロールの使用法 code_form 効果

バリデーター検証コントロールの使用法 code_form 効果

WBOY
リリース: 2016-05-16 18:15:37
オリジナル
1177 人が閲覧しました

以下は JS コードです (オブジェクトをバインドするときに非常に洗練されていないように感じます。専門家にアドバイスをいただければ幸いです!)

コードをコピー コードは次のとおりです。

function validator(obj,option){//Validation object
var self = this;
if(!(self instanceof validator))
return new validator(obj,option);
self.source={'mobile':'^(13|14|15|18)[0-9]{9}$','postcode':' ^\d {6}$','整数':'^-?\d*$','メール':'^\w ((-\w )|(\.\w ))*\@[A -Za- z0-9] ((\.|-)[A-Za-z0-9] )*\.[A-Za-z0-9] $','url':'^http[s]? :\/ \/([\w-] \.) [\w-] ([\w-./?%&=]*)?$'};
for(var i in self.source); {
if(i==option.type)
self.type=self.source[i];
self.tag=2;
self.input=obj; 🎜>self .options=option;
self.tip=document.getElementById(self.options.tips);
self.text=self.tip.innerHTML; 🎜>}
validator.prototype.init=function(o){
var self=this;
addEvent(o,'focus',function(){
self.focus();
} );
addEvent(o,'blur',function(){
self.valid();
});
}
validator.prototype.valid=function( ){
var self=this;
var reg=self.options.reg||self.type;
if(new RegExp(reg).test(self.input.value.replace(/s) /ig, ''))){
self.tip.className='validator_oncorrect';
self.tip.innerHTML='入力は正しい';
self.tag=1; else{
self.tip.className='validator_onerror';
self.tip.innerHTML='申し訳ありませんが、入力した内容はルールに準拠していません。 ';
self.tag=0;
}
}
validator.prototype.focus=function(){
this.tip.className='validator_onfocus'; tip.innerHTML=this.text;
}
function addEvent(el,type,fn){ //バインドイベント
if(el.attachEvent) {
el['e' type fn ] = fn; //ウィンドウの代わりに el オブジェクトを指すように、IE の下の要素参照をコピーします。
el[type fn] = function(){el['e' type fn](window.event);}
el.attachEvent('on' type, el[type fn]);
}else
el.addEventListener(type, fn, false);
// ページ呼び出しメソッド
var inputs=document.getElementsByTagName('input');//ここでの書き方は奇妙で洗練されていないように感じますが、最適化する方法はまだ見つかりません
var arr=[]; >arr[0]= validator(inputs[0],{type:'postcode',tips:'m1'});
arr[1]=validator(inputs[1],{type:'url',ヒント:'m2'} );
arr[2]=validator(inputs[2],{type:'email',tips:'m3'});
arr[3]=validator(inputs[ 3],{タイプ: 'モバイル',ヒント:'m4'});
arr[4]=validator(入力[4],{タイプ:'整数',ヒント:'m5',reg:'^ -?\d*$ '});
function submitForm(){//送信フォームのフィルタリング
var l=arr.length;
for(var i in arr){
if(arr) [i].tag= =1)
l--;
else if(arr[i].tag==2){
arr[i].valid();
}
if(l!=0)return false;
}


以下は、小さなアイコンが表示されていない可能性があります。実行可能コードを送信します。




コードをコピー

コードは次のとおりです:









验证控件



验证控件





邮编:


邮政编码只能为6位数字,有助于更快邮寄或快递。



网址:


请正确输入url地址



邮箱:


请输入正确的E-mail格式,并带有@符号,不区分大小写。



手机:


手机号码只能为11位数字。



整数:


请正确输入整数









関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート