输入框组件是对文本框
<input type="text">和多行文本框<textarea>元素的扩展
输入框点缀是指给普通输入框附加其他元素来进行动静态修饰，其结构包含：容器、前缀、输入框、后缀。
<div class="layui-input-{容器类}">
<div class="layui-input-{前缀类}"></div>
<input class="layui-input" placeholder="输入框">
<div class="layui-input-{后缀类}"></div>
</div>
class="layui-input-group"class="layui-input-wrap"class="layui-input-prefix"class="layui-input-suffix"class="layui-input-prefix layui-input-split"class="layui-input-suffix layui-input-split"通过在不同层级中设置规定的 CSS 类来实现点缀布局，再按照不同需求，在前缀和后缀中放置图标等任意内容。
前置和后置结构是输入框的自适应结构，可以很灵活地控制前后置内容与输入框的宽度比例。
<div class="layui-input-group">
<div class="layui-input-prefix">前置内容</div>
<input type="text" class="layui-input">
<div class="layui-input-suffix">后缀内容</div>
</div>
输入框前缀和后缀是输入框的纯修饰结构，前缀和后缀宽度固定且其元素不可触及，即只能触及输入框本身。
<div class="layui-input-wrap">
<div class="layui-input-prefix">前缀图标</div>
<input type="text" class="layui-input">
<div class="layui-input-suffix">后缀图标</div>
</div>
注意「前置和后置」与「前缀和后缀」 二者使用时切勿混淆。
该功能允许对输入框内容进行相关动态操作。通过对输入框元素设置 lay-affix 属性来开启动态点缀。
| 点缀 | 属性值 |
|---|---|
| 数字输入框 2.8.9+ | lay-affix="number" |
| 密码框显隐 | lay-affix="eye" |
| 内容清除 | lay-affix="clear" |
| 自定义动态点缀 | lay-affix="customName" |
一般搭配 <input type="number"> 使用，用于替代原生数字输入框，支持的属性如下：
| 属性 | 描述 |
|---|---|
| step | 设置数字的加减间隔 |
| min | 设置数字的最小值 |
| max | 设置数字的最大值 |
| lay-precision 2.8.18+ | 设置数字的小数位精度。注2.9.8+：若值为 0，则表示取整。 |
一般搭配 <input type="password"> 使用，用于控制输入框内容的显示和隐藏。
一般搭配 <input type="text"> 使用，用于清除输入框的内容。
我们还可以对 lay-affix 属性设置任意图标值，从而实现自定义动态点缀功能。 其中 lay-affix="customName" 值对应图标类layui-icon-后面的名称（#详见图标列表）。且可通过「点缀事件」完成自定义操作。
输入框的自定义动态点缀功能，让原本单一的输入框有了更多的想象空间。
form.on('input-affix(filter)', callback);
input-affix 为输入框动态点缀事件固定名称filter 为输入框对应的 lay-filter 属性值该事件在点击输入框的点缀图标时触发，通过该事件可以完成一些自定义操作。
form.on('input-affix(filter)', function(data){
var elem = data.elem; // 获取输入框 DOM 对象
var affix = data.affix; // 获取输入框 lay-affix 属性值
console.log(this); // 当前触发点缀事件的图标元素
});