Question

有没有人在github上使用过这个自动完成插件？当你调用自动完成功能时，你可以传递下拉框中像素的宽度变量，即“宽度：200”。

我希望下拉列表与输入字段的大小相同。当您知道输入字段的宽度时，这可以正常工作，但是当使用响应输入字段根据您使用的设备更改宽度时，您将如何将其设置为当前输入字段的宽度？

Answer 1

如果您正在谈论此插件：https://github.com/devbridge/jQuery-Autocomplete。

我遇到了同样的问题并做了一个解决方法。我将宽度设置为固定值，如下所示：

$('#input').autocomplete({
    width: 780
});

然后，每当页面调整大小时，我都会运行此函数：

function page_resize(){
    $('.autocomplete-suggestions').css('width', $('#input').width());
}

Answer 2

我尝试了很多不同的方法来解决这个问题。我认为我遇到的最佳解决方案是将宽度设置为非常小的尺寸，它实际上会调整大小/调整到更大的指定宽度。

示例CSS：

.ui-autocomplete {
    max-height: 400px;
    width: 200px; /* just setting it very small it will resize to the input field*/
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    z-index: 1000;
}

jQuery自动完成插件1.2.3响应宽度下拉列表

2 个答案: