关于layui select option莫名多一行的问题

场景说明

网页代码如下：

        <div class="layui-form-item">
            <label class="layui-form-label">抵销优惠劵</label>
            <div class="layui-input-block">
                <select id="memberCouponId" name="memberCouponId" lay-filter="couponChange">
                    <option value="" selected>如需要销除用户的优惠劵，请进行选择，否则请勿操作</option>
                    <#list memberCouponList! as coupon>
                        <option value="${(coupon.id?c)!}">${coupon.title!}<span style="color:#ff4343">(-£${(coupon.couponAmount?c)!})</span></option>
                    </#list>
                </select>
            </div>
        </div>

网页显示结果

HTML代码

问题原因：实际layui会页面加载中，会根据对应的class name和select元素来渲染显示元素。用于在option里面有span块，导致layui select render识别有两个option选项。

layui form.js源码

解决方法

        <div class="layui-form-item">
            <label class="layui-form-label">抵销优惠劵</label>
            <div class="layui-input-block">
                <select id="memberCouponId" name="memberCouponId" lay-filter="couponChange">
                    <option value="" selected>如需要销除用户的优惠劵，请进行选择，否则请勿操作</option>
                    <#list memberCouponList! as coupon>
                        <option value="${(coupon.id?c)!}">${coupon.title!}(-£${(coupon.couponAmount?c)!})</option>
                    </#list>
                </select>
            </div>
        </div>

去掉option包裹的span代码内容即可。