layui对象及相关事件

1. 表单元素

     输入框

     密码框

     下拉列表【重新渲染】

是加入layui-form 引入form模块

lay-search=""  是否支持下拉输入过滤

     单选框【重新渲染】

是加入layui-form 引入form模块

     复选框【重新渲染】

是加入layui-form 引入form模块

lay-skin="primary"  使用原始的样式

     开关【重新渲染】

是加入layui-form 引入form模块

使用checkbox实现

lay-skin="switch"  使用皮肤

     文本域

     富文本

         

1. 表单对象form

1. 监听提交事件

1. 监听下拉框改变事件

1. 监听复选框改变事件

1. 监听开关改变事件

1. 监听单选框选中事件

1. 元素渲染

1. 表单初始赋值

//初始化表单                          $("#btn2").click(function(){                               form.val("dataFrm",{                                    username:'张大明',                                    pwd:'123456',                                    phone:'13311112222',                                    email:'[email protected]',                                    jiguan:'北京',                                    sex:'女',                                    //hobby:["写作","阅读","游戏"],                                    ishere:false                               });                                                              var hobby="写作,游戏";                               var hobbys=hobby.split(",");                               //得到hobbyElem                               var hobbyElem=$("[name='hobby']");                               $.each(hobbys,function(i,str){                                    alert(str);                                    $.each(hobbyElem,function(j,item){                                         var jdom=$(item);// 把dom--转jdom                                         if(jdom.val()==str){                                              //jdom.attr({"checked",true});                                              jdom.attr("checked","checked");                                         }                                    })                               })                               form.render();                                                         });

1. 表单验证

使用方法

lay-verify="required|phone"

       相关的值

                  required  非空验证

                  phone  手机号验证

                  number 数值验证

                  url  链接地址验证 http://www.baid.com

自定义验证

<%--

  Created by IntelliJ IDEA.

  User: Lenovo

  Date: 2019/10/2

  Time: 21:32

  To change this template use File | Settings | File Templates.

--%>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

    

    

    

    

    

    

    

        用户名

        

            

        

    

    

   

 

 

 

    

    

        用户密码

        

            

        

    

    

 

 

 

 

    

        

            验证手机

            

                

            

        

        

 

        

            验证邮箱

            

                

            

        

    

 

 

 

 

    

        

        籍贯

        

            

                

                广东

                广西

                山东

                山西

                北京

            

            

        

    

 

 

 

 

 

 

 

 

    

        单选框

        

            

            

            

        

    

 

 

 

 

    

        爱好

        

            

            

            

        

    

 

 

 

 

 

 

 

 

 

 

 

 

    

        是否在职

        

            

        

    

 

 

 

 

 

 

 

 

 

 

    

        

            立即提交

            重置

            向select里面添加一个深圳

            初始化表单