真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

如何用vue和element實(shí)現(xiàn)限制el-input框輸入內(nèi)容

讓客戶滿意是我們工作的目標(biāo),不斷超越客戶的期望值來自于我們對這個行業(yè)的熱愛。我們立志把好的技術(shù)通過有效、簡單的方式提供給客戶,將通過不懈努力成為客戶在信息化領(lǐng)域值得信任、有價(jià)值的長期合作伙伴,公司提供的服務(wù)項(xiàng)目有:國際域名空間、雅安服務(wù)器托管、營銷軟件、網(wǎng)站建設(shè)、山西網(wǎng)站維護(hù)、網(wǎng)站推廣。


    
    




    
    




    
    




    
    




    
    

// 雙向綁定 輸入框(下布轉(zhuǎn)數(shù)、保底轉(zhuǎn)數(shù)、單價(jià)(元/轉(zhuǎn))、保底工資、加機(jī)費(fèi)) - 限制輸入

changeSalary(row, index, type) {
    this.$nextTick(() => {
        // 先把非數(shù)字的都替換掉(空),除了數(shù)字和.
        this.clothProduceData[index][type] = this.clothProduceData[index][
            type
        ].replace(/[^\d.]/g, "");
        // 必須保證第一個為數(shù)字而不是.
        this.clothProduceData[index][type] = this.clothProduceData[index][
            type
        ].replace(/^\./g, "");
        // 保證只有出現(xiàn)一個.而沒有多個.
        this.clothProduceData[index][type] = this.clothProduceData[index][
            type
        ].replace(/\.{3,}/g, "");
        // 保證.只出現(xiàn)一次,而不能出現(xiàn)兩次以上
        this.clothProduceData[index][type] = this.clothProduceData[index][type]
            .replace(".", "$#$")
            .replace(/\./g, "")
            .replace("$#$", ".");
        // 限制幾位小數(shù)
        let subscript = -1;
        for (let i in this.clothProduceData[index][type]) {
            if (this.clothProduceData[index][type][i] === ".") {
                subscript = i;
            }
            if (subscript !== -1) {
                if (i - subscript > this.decimalNum(type)) {
                    this.clothProduceData[index][type] = this.clothProduceData[index][
                        type
                    ].substring(0, this.clothProduceData[index][type].length - 1);
                }
            }
        }
    });
},
// 下布轉(zhuǎn)數(shù)、保底轉(zhuǎn)數(shù):整數(shù);單價(jià)(元/轉(zhuǎn)):4位小數(shù); 保底工資、加機(jī)費(fèi):2位小數(shù)
decimalNum(type) {
    if (type == "revolutions_count" || type == "overproduction") {
        return -1;
    }
    if (type == "revolution_price") {
        return 4;
    }
    if (type == "knit_loom_price" || type == "add_machine_reward") {
        return 2;
    }
},

// 鍵盤事件(向上、向下)

keyboard(evt, index) {
    let newIndex;
    let _this = this;
    let ev = evt ? evt : window.event;
    let clssName = ev.target.offsetParent.className;
    if (clssName.indexOf("count_input") != -1) {
        newIndex = index * this.paramNum;
    } else if (clssName.indexOf("over_input") != -1) {
        newIndex = index * this.paramNum + 1;
    } else if (clssName.indexOf("revolution_input") != -1) {
        let num = this.paramNum === 2 ? 1 : 2;
        newIndex = index * this.paramNum + num;
    } else if (clssName.indexOf("knit_input") != -1) {
        newIndex = index * this.paramNum + 3;
    } else if (clssName.indexOf("add_input") != -1) {
        newIndex = index * this.paramNum + 4;
    }
    // 獲取每一列input
    let inputAll = document.querySelectorAll(".table_input input");
    let allLength = inputAll.length;
    // 向上
    if (ev.keyCode == 38) {
        if (newIndex <= this.paramNum - 1) {
            return false;
        } else {
            newIndex -= this.paramNum;
        }
        if (inputAll[newIndex]) {
            inputAll[newIndex].focus();
        }
    }
    // 向下
    if (ev.keyCode == 40) {
        if (newIndex >= allLength - this.paramNum) {
            return false;
        } else {
            newIndex += this.paramNum;
        }
        if (inputAll[newIndex]) {
            inputAll[newIndex].focus();
        }
    }
},

因?yàn)槟俏鍌€字段是判斷顯示的,相應(yīng)的,paramNum這個參數(shù)是一行顯示有多少個輸入框

clothProduceData是表格綁定的值,也就是tableData


文章標(biāo)題:如何用vue和element實(shí)現(xiàn)限制el-input框輸入內(nèi)容
當(dāng)前鏈接:http://weahome.cn/article/jpcisc.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部