colorpicker,是layui自带组件,在实际开发过程中,直接调用即可。
<div class="layui-form-item"> <label for="temp_border" class="layui-form-label">边框颜色</label> <div class="layui-inline"><input type="text" id="temp_border" name="temp_border" lay-verify="required" class="layui-input" value="#ad0101"></div> <div class="layui-inline"><span id="test1"></span></div> <div class="layui-inline"><span class="x-red">*</span> 单击选择边框颜色</div> </div>
layui.use(['form', 'upload', 'layer','colorpicker'], function () { $ = layui.jquery; form = layui.form; var layer = layui.layer,upload = layui.upload; var colorpicker = layui.colorpicker; //初始色值 colorpicker.render({ elem: '#test1' ,color: temp_border ,change: function(color){ $("#temp_border").val(color); } }); });
- elem: ‘#test1’,对应容器ID
- color: temp_border,默认颜色,格式:#e06161
- change,回调函数;
@lockdata.cn