vue input 輸入校驗字母數(shù)字組合且長度小于30的實現(xiàn)代碼
更新時間：2018年05月16日 10:30:12 作者：zghgchao
這篇文章主要介紹了vue input 校驗字母數(shù)字組合且長度小于30的實現(xiàn)代碼，文章給大家補充介紹了在Vue.Js下使用el-input框只能輸入數(shù)字并限制位數(shù)并且限制中文輸入以及粘貼功能，感興趣的朋友跟隨腳本之家小編一起看看吧
下面一段代碼給大家分享vue input 校驗字母數(shù)字組合且長度小于30，具體代碼如下所示：
<Input v-model="form.glhm" placeholder="請輸入關(guān)聯(lián)交易號" style="width:240px" @on-blur="validateJyh(form.glhm)"></Input>
validateJyh(glhm){//校驗關(guān)聯(lián)交易號
var reg = /^[A-Za-z0-9]{1,30}$/;
if(!reg.test(glhm)){
this.$Message.error("請輸入字母或數(shù)字組成的交易關(guān)聯(lián)號");
this.form.glhm = '';
}
},
下面看下在Vue.Js下使用el-input框只能輸入數(shù)字并限制位數(shù)并且限制中文輸入以及粘貼
var tr = document.getElementById("Id1"), // 取得ID為Id1的tr對象
inps = tr.getElementsByTagName('input'); // 從tr 對象中獲取所有input對象
for(var i = 0, len = inps.length; i < len; i++) {
inps[i].value = ''; // 將每一個input的value置為空
}
document.getElementById("t").getElementsByTagName('input')[0].value='';
輸入中文置空的方法
<el-input
@change="checkNo(searchForm.msel.mselTotalConsumTimes)"
type = "text"
onkeypress="return event.keyCode>=48&&event.keyCode<=57"
size="small"
:maxlength="6"
style="width: 120px"
v-model="searchForm.msel.mselTotalConsumTimes"></el-input>
次
</el-col>
checkNo(value){
let reg = /^[1-9]\d*$/;
if (value) {
if (value >
999999 || new
RegExp(reg).test(value) ==
false) {
setTimeout(()
=> {
this.searchForm.msel.mselTotalConsumTimes ='';
}, 500);
}
}
},
總結(jié)
以上所述是小編給大家介紹的vue input 校驗字母數(shù)字組合且長度小于30的實現(xiàn)代碼，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
本文主要介紹了淺談Vue?DIFF，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
這篇文章主要介紹了vue+element表單校驗功能,本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友可以參考下2019-05-05
我們都知道跨域是同源策略導(dǎo)致的,域名不同、協(xié)議不同、端口號不同任意一種情況都會導(dǎo)致跨域,這篇文章主要介紹了從Vue到Postman全面驗證API接口跨域問題,需要的朋友可以參考下2024-08-08
關(guān)于vue利用postcss-pxtorem進行移動端適配的問題
這篇文章主要介紹了關(guān)于vue利用postcss-pxtorem進行移動端適配的問題，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
vue+iview/elementUi實現(xiàn)城市多選
這篇文章主要介紹了vue+iview/elementUi實現(xiàn)城市多選，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
在vue項目中使用Jquery-contextmenu插件的步驟講解
今天小編就為大家分享一篇關(guān)于在vue項目中使用Jquery-contextmenu插件的步驟講解，小編覺得內(nèi)容挺不錯的，現(xiàn)在分享給大家，具有很好的參考價值，需要的朋友一起跟隨小編來看看吧2019-01-01
本文主要介紹了vue.js實現(xiàn)綁定class和style樣式的方法。具有很好的參考價值。下面跟著小編一起來看下吧2017-04-04
Vue+ElementUI實現(xiàn)從后臺動態(tài)填充下拉框的示例代碼
本文主要介紹了Vue+ElementUI實現(xiàn)從后臺動態(tài)填充下拉框的示例代碼，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
淺談Vue2.0中v-for迭代語法的變化(key、index)
下面小編就為大家分享一篇淺談Vue2.0中v-for迭代語法的變化(key、index)，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
vee validate 一個輕量級的 vue表單驗證插件。接下來通過本文給大家分享Vue中使用vee-validate表單驗證的方法，需要的朋友參考下吧2018-05-05