【NIUSHOP】标准代码（前端）-表单

label宽度
layui-form-label 155px
layui-form-label sm 100px

input宽度
input框 最短（100px）: ns-len-small
input框 短（160px）: ns-len-short
input框 中（250px）: ns-len-mid
input框 长（500px）: ns-len-long

输入框
效果图：

代码如下：

输入框

类型： 1、文字输入框 type="text" 2、数字输入框 type="number" 3、密码输入框 type="password"

注意：
required：注册浏览器所规定的必填字段
lay-verify：注册form模块需要验证的类型
class=“layui-input”：layui.css提供的input样式

添加必输项标识
效果图：

关键代码：

*
代码如下：

*必填

添加解释说明 效果图：

关键代码（注释一）：

注释一
代码如下（注释一）：

注释一

注释一

关键代码（注释二）：

注释二

注意：摆放位置不同

代码如下（注释二）：

注释二

注释二

关键代码（注释三）：

注释三
代码如下（注释三）：

注释三

注释三

复选框 效果图：

代码如下:

复选框

注意： checkboxs 表示选中 单选按钮 效果图：

代码如下：

单选框

注意：
checked 表示选中

开关按钮
效果图：

代码如下：

开关关

表单展示 效果图：

代码如下：

表单展示

2019-11-11 15:30:29

表单 - 按钮 效果图：

代码如下：

保存 返回

一行多列 效果图：

代码如下：

缩略大图（单位：px）

宽

高

手动触发select事件 layui没有封装手动触发select的事件，可以参考以下代码：

$(“select[name=‘category’]”).siblings(“div.layui-form-select”).find(“dl dd[lay-value='” + value + “']”).click();

字段集区块
效果图：

代码如下：

标题

内容区域