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

知识点掌握了，还需要不断练习才能熟练运用。下面golang学习网给大家带来一个文章开发实战，手把手教大家学习《使用 Flexbox 生成下拉框，点击空白区域无法收起，如何解决？》，在实现功能的过程中也带大家重新温习相关知识点，温故而知新，回头看看说不定又有不一样的感悟！

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

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

代码：

<div   style="max-width:100%">
    <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 生成下拉框，点击空白区域无法收起，如何解决？》的介绍应该让你收获多多了吧！欢迎大家收藏或分享给更多需要学习的朋友吧~golang学习网公众号也会发布文章相关知识，快来关注吧！