Layui 양식 유효성 검사 소개-레이이 튜토리얼-php.cn

Layui 양식 유효성 검사 소개

尚

풀어 주다： 2020-06-12 17:22:37

앞으로

3014명이 탐색했습니다.

Layui 양식 유효성 검사 소개

1. 정렬 확인

html code

<div class="layui-form-item">
             <label class="layui-form-label">排序</label>
            <div class="layui-input-block">
              <input type="number" name="sort" autocomplete="off" min="0" max="99999"  lay-verify="sort" class="layui-input">
            </div> 
          </div>

로그인 후 복사

type="number" 그러면 텍스트 상자 뒤에 위와 같은 효과가 나타나며 숫자와 소수점만 입력할 수 있습니다

js code

layui.use([ "form", "layer" ], function() {
var    form = layui.form;
var    layer = layui.layer;
    //表单验证
    form.render();//这句一定要加，占坑
     form.verify({

         sort:[/^$|^[0-9]{0,5}$/, &#39;只能是数字且范围0~99999！&#39;]//这个就是上面的排序lay-verify="sort" 
         ,remark: function (value){
             if(value.length > 200){
                 return &#39;长度大于200！请重新输入&#39;;
             }
         }
     });

     });

로그인 후 복사

2.금액확인

정렬과 효과는 같습니다

<div class="layui-form-item">
            <label class="layui-form-label">余额(元)</label>
            <div class="layui-input-block">
                <input type="number" name="balance" id="balance" lay-verify="money"
                 autocomplete="off" placeholder="单位：元"  
                    class="layui-input" >
            </div>
        </div>

로그인 후 복사

layui.use([ "form", "layer", "laydate" ], function() {
    laydate = layui.laydate;
    form = layui.form;
    layer = layui.layer;// 表单验证
    form.render();
    form.verify({
        lenth50 : function(value) {
            if (value.length > 50) {
                return &#39;长度大于50！请重新输入&#39;;
            }
        },
        lenth400 : function(value) {
            if (value.length > 400) {
                return &#39;长度大于400！请重新输入&#39;;
            }
        },
        money : function(value) {
            if (value.length > 0) {
                var reg = /(^[0-9]([0-9]+)?(\.[0-9]+)$)|(^(0){1}$)|(^([0-9]+)?$)/;
                if (!reg.test(value)) {
                    return &#39;输入格式有误&#39;;
                }
            }
            if (value.length > 50) {
                return &#39;长度大于50！请重新输入&#39;;
            }
        }

    });　　　　
    //下面这段代码主要是用于强制清除当用户输入0开头的数字，比如0000,02323，匹配到的话就为0
    //如果要在layui里面 写js事件之类的代码就一定要放在use组件模块里面，这是其中一个坑！
　　　　$(&#39;#balance&#39;).bind(&#39;input propertychange&#39;, function() {
　　　　		　var balance = $("#balance").val();		　　　　　　
　　　　		　var zero = /^(0){2,}$|^(0)([0-9])?$/;		　　　　　　
　　　　		　if (zero.test(balance)) {			　　　　　　
　　　　		　$(&#39;#balance&#39;).val(0);		　　　　　　
　　　　		　}	　　　　
　　　　		　});

});

로그인 후 복사

layui에 대한 자세한 내용은 PHP 중국어 홈페이지layui tutorialcolumn

을 참고해주세요.

위 내용은 Layui 양식 유효성 검사 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!