js 控制input输入框只能输入数字的方法

我要冲啦个人网站建设2024-11-15web前端

<el-input v-model="row.field" @input="validateNumber(row, 'field') />
 

   // 只能是数字

    validateNumber(row, field) {

      // 使用正则表达式来判断输入是否为数字

      /* row[field] = row[field].replace(/\D+/g, '') // 整数*/

      const regex = /^[0-9]*\.?[0-9]*$/;

      if (!regex.test(row[field])) {

        row[field] = row[field].replace(/[^0-9.]/g, ''); // 可以是小数

      }

    },

    // 最多三位小数

    validateNumber1(row, field) {

      row[field] = row[field].replace(/[^\d.]/g, '') // 只能输入数字

        .replace(/\.{2,}/g, '.') // 出现多个点时只保留第一个

        .replace(/^(\-)*(\d+)\.(\d\d\d).*$/, '$1$2.$3') // 只能输入三个小数

        .replace(/^(\-)*00*(\d)([0-9]*)/g,'$1$2$3') // 前两位不能同时是0;"

      /* // 第一位不让输小数点

      if (row[field] == '.') {

        row[field] = '';

      } */

    },

    // 只可以是整数

    validateNumber2(row, field) {

      row[field] = row[field].replace(/[^\d.]/g, '') // 只能输入数字

        .replace(/\.{2,}/g, '.') // 出现多个点时只保留第一个

        .replace(/^(\-)*(\d+)\..*$/, '$1$2') // 只能输入整数

        .replace(/^(\-)*00*(\d)([0-9]*)/g,'$1$2$3') // 前两位不能同时是0;"

      /* // 第一位不让输小数点

      if (row[field] == '.') {

        row[field] = '';

      } */

    },

    // 控制输入框输入内容

    inputValidate(type, row, field) {

      if (type == 'number') {

        row[field] = row[field].replace(/[^0-9.]/g, '').replace(/\.{2,}/g, '.').replace(".","$#$").replace(/\./g,"").replace("$#$",".").replace(/^(\-)*00*(\d)([0-9]*)/g,'$1$2$3'); // 可以是小数

      } else if (type == 'int') {

        row[field] = row[field].replace(/[^0-9]/g, '').replace(/^(\-)*00*(\d)([0-9]*)/g,'$1$2$3'); // 整数

      }

    },

文章关键词
js
input输入框只能输入数字