Element input 正则验证 数字包含正负数 小数点 只包含一个小数点 一个 '-'

 

转自于：https://www.cnblogs.com/qfcddl/p/13389566.html

 

<el-input placeholder v-model="scope.row[index]" 
　　oninput="value=value.replace(/[^\-?\d.]/g,'')
　　.replace(/^\./g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')
　　.replace('-','$#$').replace(/\-/g,'').replace('$#$','-')">
</el-input>

　　

elementui el-input组件限制只能输入数字且小数点为3位、只有一位小数点、0开头后面不是小数点则以数字替换、自动补全

代码实现如下：

<el-input
v-model="scope.row.num"
size="mini"
oninput="
this.value=this.value.replace(/\D*(\d*)(\.?)(\d{0,3})\d*/,'$1$2$3') // 只能输入数字、小数点限制3位
.replace(/^0+(\d)/, '$1') // 第一位0开头，0后面为数字，则过滤掉，取后面的数字
.replace(/^\./, '0.') // 如果输入的第一位为小数点，则替换成 0. 实现自动补全
.match(/^\d*(\.?\d{0,3})/g)[0] || '' // 数字开头、小数点3位
"
/>

　　

————————————————
版权声明：本文为CSDN博主「拾一九」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/DarlingYL/article/details/125875098

　　<!-- 只能输入正负数和小数点 -->
            <el-input
              v-model="form.itemnum"
              :placeholder="$t('info.pleaseInput') + datas.itemName"
              @input="digitalVerification"
            ></el-input>

 　　digitalVerification(ipt) {
        let data = String(ipt);
        const char = data.charAt(0);
        // 先把非数字的都替换掉
        data = data
          // 转化为数字形式--包含小数，负数
          // 先把非数字的都替换掉，除了数字和.
          .replace(/[^\d.]/g, '')
          // 必须保证第一个为数字而不是.
          .replace(/^\./g, '')
          // 保证只有出现一个.而没有多个.
          .replace(/\.{2,}/g, '.')
          // 保证.只出现一次，而不能出现两次以上
          .replace('.', '$#$')
          .replace(/\./g, '')
          .replace('$#$', '.')
          // 第一位0开头，0后面为数字，则过滤掉，取后面的数字
          .replace(/^0+(\d)/, '$1')
          // 如果输入的第一位为小数点，则替换成 0. 实现自动补全
          .replace(/^\./, '0.');
        // 如果第一位是负号，则允许添加
        if (char === '-') {
          data = '-' + data;
        }
        this.form.itemnum = data;
      },

　　或者直接输入框中验证

<!-- 数字 -->
                <el-input
                  style="width: 220px"
                  v-model="item.detail"
                  :placeholder="$t('info.pleaseInput') + item.supplementName"
                  v-if="item.supplementInputTypeId == 6"
                  oninput="value=value.replace(/[^\d.]/g, '')
                  .replace(/^-(0[0-9])/,'') //验证首位出现类似于-01,-02（验证首个字符为负号加这行就行）
                  .replace(/^\./g, '')
                  .replace(/\.{2,}/g, '.')
                  .replace('.', '$#$')
                  .replace(/\./g, '')
                  .replace('$#$', '.')
                  .replace(/^0+(\d)/, '$1')
                  .replace(/^\./, '0.')"
                ></el-input>

　　

另外知识扩充推荐： 原文链接：https://blog.csdn.net/qq_38181746/article/details/125672547

输入框验证可以输入正负数，小数保留两位小数
在使用input输入金额时，对金额做校验
在使用input输入金额时，对金额做校验
<input class="layui-input" name="balance" id="clientinfo_balance" onkeyup="clearinteger(this)" lay-verify="required" autocomplete="off" />

// 正负数，小数保留2位小数

function clearinteger(obj){
obj.value = obj.value.replace("-.","%$%").replace(/\-\./g,"").replace("%$%","-");
obj.value = obj.value.replace(".-","$#$").replace(/\.\-/g,"").replace("$#$",".");
obj.value = obj.value.replace(/[^-\d.]/g,""); //清除"数字"和"."以外的字符
obj.value = obj.value.replace(/^\./g,""); //验证第一个字符是数字而不是
obj.value = obj.value.replace(/^(0[0-9])/,""); //验证首位出现类似于01,02的金额
obj.value = obj.value.replace(/^-(0[0-9])/,""); //验证首位出现类似于-01,-02的金额
obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");//只保留第一个. 清除多余的
obj.value = obj.value.replace("-","$%$").replace(/\-/g,"").replace("$%$","-");//只保留第一个- 清除多余的
obj.value = obj.value.replace(/\d{1,}-|\d{1,}\.\d{1,2}-/,"");//不能在数字后面输入-
// obj.value = obj.value.replace(/^(-)?(\d+)\.(\d\d\d).*$/,'$1$2.$3'); //只能输入三位小数
obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3');//只能输入两个小数
}

// 验证正负整数

function getinteger(obj){
obj.value = obj.value.replace("-","%$%").replace(/\-/g,"").replace("%$%","-");
obj.value = obj.value.replace(/[^-\d]/g,""); //清除"数字"和"."以外的字符
obj.value = obj.value.replace(/^\./g,""); //验证第一个字符是数字而不是
obj.value = obj.value.replace(/^(0[0-9])/,""); //验证首位出现类似于01,02的金额
obj.value = obj.value.replace(/^-(0[0-9])/,""); //验证首位出现类似于-01,-02的金额
obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");//只保留第一个. 清除多余的
obj.value = obj.value.replace("-","$%$").replace(/\-/g,"").replace("$%$","-");//只保留第一个- 清除多余的
obj.value = obj.value.replace(/\d{1,}-|\d{1,}\.\d{1,2}-/,"");//不能在数字后面输入-
}