使用 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 生成下拉框,点击空白区域无法收起,如何解决?的详细内容,更多请关注其它相关文章!