vue中常常遇到一些需要自定義校驗方法的場景,下面整理了我在開發過程中遇到的一些特殊場景,以及這些場景下我的處理方法(這個時不時遇到乙個,因此不定期更新中…)
<-- 頁面結構 -->
class="input-text">
type="tel" v-model="withdraw_amount" style="font-size: 16px;color: #000;" />
div>
<-- cashnumber為可提現金額 -->
name="fade" v-if="(cashnumber>3||cashnumber==3)&&canclick">
class="page-bottom-btn" v-if="load" style="transition-delay: 0.1s;" >
class="g-btn
btn-blue" @click="submit :key="1">確定提現a>
div>
transition>
name="fade" v-else>
class="page-bottom-btn" v-if="load" style="transition-delay: 0.1s;" >
class="g-btn" style="background: #ccc;color:#fff" :key="2">確定提現p>
div>
transition>
//以下為js關鍵**
data: ,
cashnumber: "0",
withdraw_amount:0,
canclick:true,
},methods:
if(!isnan(val))else
}, submit:function
(val)
},watch: else
}else
if(this.withdraw_amount>_this.cashnumber-0)
},}
<-- 結構 -->
"text" name="username" v-model="username" v-on:blur="nameischinese" placeholder="姓名" minlength="1" maxlength="4"/>
"text" name="idcard" v-model="idcard" v-on:blur="isidcardno" @keyup="checkidinput" placeholder="身份證號" maxlength="18" />
"loginfooter" type="text" name="bankcard" v-model="bankcard" @keyup="showbanklimit" v-on:blur="checkbankno" placeholder="銀行卡號" maxlength="19" />
"text" name="phonenum" v-model="phonenum" v-on:blur="checkphone" placeholder="銀行預留手機號" maxlength="11"/>
//以下為關鍵js**
data: ,
methods: ,
//校驗使用者名稱輸入 輸入2-4個漢字
nameischinese:function
()$/))else
},checkidinput:function
()else
},isidcardno:function
(num)
// check and set value
for(i=0;iif ((vararray[i] < '0' || vararray[i] > '9') && (i != 17)) else
if (i < 17)
} if (intstrlen == 18)
// calculate the sum of the products
for(i=0;i<17;i++)
// calculate the check digit
intcheckdigit = 12 - lngproduct % 11;
switch (intcheckdigit)
// check last digit
if (vararray[17].touppercase() != intcheckdigit)
} else
} // alert ("correct.");
this.idflag=1;
return
true;
},showbanklimit:function
()else
if(this.bankcard.length>=6)
}else
},//銀行卡號luhn校驗演算法
//luhn校驗規則:16位銀行卡號(19位通用):
//1.將未帶校驗位的 15(或18)位卡號從右依次編號 1 到 15(18),位於奇數字型大小上的數字乘以 2。
//2.將奇位乘積的個十位全部相加,再加上所有偶數字上的數字。
//3.將加法和加上校驗位能被 10 整除。
//bankno為銀行卡號
luhncheck: function
(bankno)
var arrjishu=new array(); //奇數字*2的積 <9
var arrjishu2=new array(); //奇數字*2的積 >9
var arroushu=new array(); //偶數字陣列
for(var j=0;jif((j+1)%2==1)
else
//偶數字
arroushu.push(newarr[j]);
}var jishu_child1=new array();//奇數字*2 >9 的分割之後的陣列個位數
var jishu_child2=new array();//奇數字*2 >9 的分割之後的陣列十位數
for(var h=0;h10);
jishu_child2.push(parseint(arrjishu2[h])/10);
}
var sumjishu=0; //奇數字*2 < 9 的陣列之和
var sumoushu=0; //偶數字陣列之和
var sumjishuchild1=0; //奇數字*2 >9 的分割之後的陣列個位數之和
var sumjishuchild2=0; //奇數字*2 >9 的分割之後的陣列十位數之和
var sumtotal=0;
for(var m=0;mfor(var n=0;nfor(var p=0;p//計算總和
sumtotal=parseint(sumjishu)+parseint(sumoushu)+parseint(sumjishuchild1)+parseint(sumjishuchild2);
//計算luhn值
var k= parseint(sumtotal)%10==0?10:parseint(sumtotal)%10;
var luhn= 10-k;
if(lastnum==luhn)else
},//檢查銀行卡號
checkbankno: function
() if(bankno.length < 16 || bankno.length > 19)
var num = /^\d*$/;//全數字
if(!num.exec(bankno))
//開頭6位
var strbin = "10,18,30,35,37,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,58,60,62,65,68,69,84,87,88,94,95,98,99";
if(strbin.indexof(bankno.substring(0, 2)) == -1)
//luhn校驗
if(!this.luhncheck(bankno))
this.bankflag=1;
return
true;
},//手機號校驗
checkphone:function
(mobile)
if(mobile.length==0)
if(mobile.length!=11)
var myreg = /^[1][3,4,5,7,8][0-9]$/;
if(!myreg.test(mobile))else
},}
jquery validate 自定義校驗方法
1.引入js jquery.min.js jquery.validate.min.js messages zh.min.js 2.新增驗證方法,第乙個引數為驗證方法的名稱,第二個引數為驗證方法。validator.addmethod money function value,element,para...
vue元件,自定義v model方法
在使用my component元件時,為了實現雙向繫結。vue.component my component model methods 上面 中 1.props物件中,需要定義乙個能夠從外部傳入的變數,這裡我定義了乙個obj。這樣就可以用下面這行 進行傳遞值 2.為了能夠使用v model語法糖,...
元件 vue自定義方法傳遞
元件樣式 麵包屑導航欄 jsvue.component bannerone props bigimg bannerheight aboutyt downlink textcolor bigbackcolors methods template bar bigback color bigbackcol...