layui⽂本框,⼿机,邮箱,textarea等格式的验证

<formclass="layui-form"action="">
<divclass="layui-form-item">
<labelclass="layui-form-label">反馈主题</label>
<divclass="layui-input-block">
<inputname="title"class="layui-input"type="text"placeholder="请输⼊标题"autocomplete="off"lay-
verify="title">
</div>
</div>
<divclass="layui-form-item">
<labelclass="layui-form-label">姓名</label>
<divclass="layui-input-block">
<inputname="fname"class="layui-input"type="text"placeholder="请输⼊姓名"autocomplete="off"lay-
verify="fname">
</div>
</div>
<divclass="layui-form-item">
<labelclass="layui-form-label">⼿机</label>
<divclass="layui-input-block">
<inputname="phone"class="layui-input"type="tel"autocomplete="off"placeholder="请输⼊⼿机"lay-
verify="phone">
</div>
</div>
<divclass="layui-form-item">
<labelclass="layui-form-label">邮箱</label>
<divclass="layui-input-block">
<inputname="email"class="layui-input"type="text"autocomplete="off"placeholder="请输⼊邮箱"lay-
verify="email">
</div>
</div>
<divclass="layui-form-item">
<labelclass="layui-form-label">单选框</label>
<divclass="layui-input-block">
<inputname="sex"title="男"type="radio"checked=""value="男">
<inputname="sex"title="⼥"type="radio"value="⼥">
<inputname="sex"title="保密"type="radio"value="密">
</div>
33. 
</div>
<!--<divclass="layui-form-item layui-form-text">
<labelclass="layui-form-label">普通⽂本域</label>
<divclass="layui-input-block">
<textareaclass="layui-textarea"placeholder="请输⼊内容">请输⼊内容</textarea>
</div>
</div>-->
<divclass="layui-form-item layui-form-text">
<labelclass="layui-form-label">内容</label>
<divclass="layui-input-block">
<textareaclass="layui-textarea layui-hide"name="contact"id="LAY_demo_editor"lay-
verify="contact"></textarea>
</div>
</div>
<divclass="layui-form-item">
<divclass="layui-input-block">
<buttonclass="layui-btn"lay-filter="demo2"lay-submit="">跳转式提交</button>
<buttonclass="layui-btn"lay-filter="demo1"lay-submit="">⽴即提交</button>
<buttonclass="layui-btn layui-btn-primary"type="reset">重置</button>
</div>
</div>
</form>
js验证代码
[html]   

<script>
layui.use(['form', 'layedit', 'laydate'], function(){  
  var form = layui.form()  
  ,layer = layui.layer  
  ,layedit = layui.layedit  
  ,laydate = layui.laydate;  


  //⾃定义验证规则
  form.verify({  
        title: function(value){  
          if(value.length <5){  
            return '标题⾄少得5个字符啊';   
          }  
        }, fname: function(value){  
          if(value.length <4){  
            return '请输⼊⾄少4位的⽤户名';  
          }  
        }, contact: function(value){  
          if(value.length <4){  
            return '内容请输⼊⾄少4个字符';  
          }  
        }  
        ,phone: [/^1[3|4|5|7|8]\d{9}$/, '⼿机必须11位,只能是数字!']  
        ,email: [/^[a-z0-9._%-]+@([a-z0-9-]+\.)+[a-z]{2,4}$|^1[3|4|5|7|8]\d{9}$/, '邮箱格式不对']  
  });  

  //创建⼀个编辑器
  layedit.build('LAY_demo_editor');  
  //监听提交
  form.on('submit(demo1)', function(data){  
    layer.alert(JSON.stringify(data.field), {  
      title: '最终的提交信息'  
    })  

    return false;  
  });  
});  
</script>

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值