【LayUI】限制文本框只能输入数字

问题描述:

使用div进行开发,需要对数字型的文本框进行验证的同时只能输入数字,不可输入其他的内容

解决方案:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link href="/new_website/scripts/layui/css/layui.css" rel="stylesheet" />
    <script src="../../new_website/scripts/jquery1.8.3/jquery-1.8.3.js"></script>
    <script src="/new_website/scripts/layui/layui.all.js"></script>
    <script src="/new_website/scripts/vue/vue.js"></script>
    <script src="../../new_website/scripts/common/clipboard.min.js"></script>
</head>
<body>
    <%-- 方法1:文本框中在lay-verify的属性中,设置为number,最后,点击提交的时候会判断只能输入数字 --%>
    <input type="text" name="nPlanAmount" lay-verify="number" autocomplete="off" class="layui-input" />

    <%-- 方法2:在输入后判断是否为数字,如果不是,则默认为0.000 --%>
    <input type="text"  lay-verify="number" name="nTopAmount" value="0.000" onblur="value=zhzs(this.value)" class="layui-input"/>

<script type="text/javascript">
/*自定义处理数字*/
function zhzs(value) {
   value = value.replace(/[^\d]/g, '').replace(/^0{1,}/g, '');
   if (value != ''){
      value = parseFloat(value).toFixed(3);
   }
   else{
      value = parseFloat(0).toFixed(3);
   }
   return value;
}
</script>
</body>
</html>

原文链接:https://www.cnblogs.com/ZengJiaLin/p/13501498.html 

posted @ 2021-09-08 16:20  智者见智  阅读(1866)  评论(0编辑  收藏  举报