Einführung in die Validierung von Laui-Formularen-Layui-Tutorial-php.cn

Einführung in die Validierung von Laui-Formularen

尚

Freigeben： 2020-06-12 17:22:37

nach vorne

3015 Leute haben es durchsucht

Einführung in die Validierung von Laui-Formularen

1. Sortierüberprüfung

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>

Nach dem Login kopieren

type="number" Danach erscheint der oben gezeigte Effekt hinter dem Textfeld , und Es können nur Zahlen und Dezimalstellen eingegeben werden

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;;
             }
         }
     });

     });

Nach dem Login kopieren

2. Betragsüberprüfung

Der Effekt ist der gleiche wie beim Sortieren

<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>

Nach dem Login kopieren

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);		　　　　　　
　　　　		　}	　　　　
　　　　		　});

});

Nach dem Login kopieren

Mehr LayuiFür Kenntnisse beachten Sie bitte die PHP-Chinesisch-WebsiteLayui-TutorialSpalte

Das obige ist der detaillierte Inhalt vonEinführung in die Validierung von Laui-Formularen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!