首页 > 解决方案 > 引导自动完成输入下拉菜单未显示

问题描述

这让我难倒了好几个小时。我正在使用 Bootstrap 3 并尝试使用带有 ajax 的引导自动完成输入(此处的文档)。数据来自 Ajax 很好,我可以看到。下拉列表也被添加到 DOM,但它具有 css 属性display: none。如果我在开发控制台中取消选中此选项,我可以看到下拉列表,但它会卡在打开状态。

为什么引导程序不处理 div 的打开/关闭?

这是代码:

<input class="form-control basicAutoComplete" placeholder="Select a ship" type="text" autocomplete="off">

<script>
    $(document).ready(function () {
        $('.basicAutoComplete').autoComplete({
            resolver: 'custom',
            formatResult: function (item) {
                return {
                    value: item.id,
                    text: "[" + item.id + "] " + item.name,
                };
            },
            events: {
                search: function (qry, callback) {
                    $.ajax(
                        "@Url.Action("shipdata", "autocomplete")",
                        {
                            dataType: "JSON", 
                            data: { 'qry': qry }
                        }
                    ).done(function (res) {
                        console.info(res.items);
                        callback(res.items);
                    });
                }
            }
        });
    });


</script>

谢谢

标签: javascripthtmljquerycssbootstrap-4

解决方案


似乎版本 3 已损坏,使用引导版本 4 有效。


推荐阅读