IYUUPlus/public/page/color-select.html

<div class="layuimini-container layuimini-page-anim">
    <div class="layuimini-main">
        <blockquote class="layui-elem-quote">
            颜色选择器使用开源项目：paigusu<br>
            <a href="http://www.jq22.com/jquery-info20030" target="_blank" class="layui-btn layui-btn-danger">TableSelect</a>
        </blockquote>
        <form class="layui-form" action="" style="padding:20px;">
            <div class="layui-form-item">
                <label class="layui-form-label">颜色选择器</label>
                <div class="layui-input-inline">
                    <input type="hidden" name="test_color" value="#1aa094">
                    <span class="layui-btn layui-btn-primary test-select-color" style="padding:0 12px;min-width:45px;background-color: #1aa094;"></span>
                </div>
            </div>
        </form>
        <pre class="layui-code">
    $(function () {
        $('.paigusu').paigusu({
            color: '#1926dc',//初始色  支持两种配置方案
        }, function (event, obj) {
            console.log(event);
            console.log(obj);
            $(event).css('color', '#' + obj.hex)
        });
    });
        </pre>
    </div>
</div>
<script src="lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="lib/jq-module/paigusu.min.js" charset="utf-8"></script>
<script>
    $(function () {
        $('.test-select-color').paigusu({
            color: '#1aa094',//初始色  支持两种配置方案
        }, function (event, obj) {
            console.log(event);
            console.log(obj);
            $(event).css('background-color', '#' + obj.hex);
            $('input[name="test_color"]').val('#' + obj.hex);
        });
    });
</script>