文本框和下拉在一起

Question

当我点击选择时，它显示在下方和右侧，但我需要选择挂在输入下方并选择。或者是否有带下拉菜单的自定义文本框？

我无法找到一个，所以我考虑建立自己，但下拉位置错误，我没有看到任何可以提供帮助的CSS。

    <div>
    <input type="text" id="Drop_Down_A" value="Select One..."><!--
    --><select id="Drop_Down_A1" style="width: 19px; height: 21px;">
    <option value="" disable>Select One...</option>
    </select>
    </div>

得到了我想要的答案。

我发布了我所追求的新结果。

<div>
  <input type="text" list="Drop_Down_A1" id="Drop_Down_A" value="Select One...">
  <datalist id="Drop_Down_A1">
    <option value="Select One..." disable>
  </datalist>
</div>

Answer 1

我认为这个插件可以帮助你https://select2.github.io

Answer 2

我不确定你想用这个来实现什么。也许直播搜索？您可能需要查看此https://silviomoreto.github.io/bootstrap-select/examples/

Answer 3

不幸的是，无法在选择框中自定义下拉列表的位置。

然而，还有其他选择。我想你正在努力实现一个可搜索的选择框，所以这里有两个解决方案：

1. 使用＆lt; datalist＆gt;。除了Safari之外，它的支持相当广泛。

2. 使用库，例如​​Select2。