使用 Flexbox 生成下拉框,点击空白区域无法收起,如何解决?

使用 flexbox 生成下拉框,点击空白区域无法收起,如何解决?

flexbox 下拉框收不回问题解决方法

问题:使用 flexbox 生成下拉框后,分页后点击空白区域,下拉框无法收起。

代码:

<div style="float: left;">
    <span class="label w110"><em class="requiredicon">*</em>*****</span>
    <input type="hidden" name="xx.dm" id="dm" value="${xx.dm}"><input type="hidden" name="xx.mc" id="mc" value="${xx.mc}">
</div>
<div id="ame" style="display: inline-table; margin-right: 40px;"></div>
function FzFlexBox() {
    $('#ame').flexbox(cj, {
        inputClass: 'ffb-input required',
        resultTemplate: '<div class="col2" title="{name}">{name}</div>',
        onSelect: function() {
            $('#dm').val($('#ame_hidden').val());
            $('#mc').val($('#ame_input').val());
        },
        paging: {
            pageSize: 10,
            summaryTemplate: '显示 {start}-{end}  共{total} 结果'
        },
        initialValue: "${xx.mc}"
    });
    $('#gldcjgGajgjgdmName_input').blur(function() {
        $('#mc').val($('#ame_input').val());
    });
}

解决方法:

缺乏关闭下拉框的代码,需要在 blur 事件中添加 $('#ame').closeflexbox(); 代码关闭下拉框。

以上就是使用 Flexbox 生成下拉框,点击空白区域无法收起,如何解决?的详细内容,更多请关注其它相关文章!