在过滤选项时保持下拉 <select> 控件打开答案

【问题标题】：Keep dropdown <select> control open while filtering options在过滤选项时保持下拉 <select> 控件打开
【发布时间】：2018-07-31 05:42:39
【问题描述】：

我正在尝试为移动用户实现这种“过滤下拉”模式：

默认情况下，<select> 控件当然是关闭的，直到用户单击它打开。

有没有一种简单的方法可以让它始终保持打开状态？我知道它不会是严格意义上的“下拉菜单”——更像是传统的 Windows“列表”控件。

（多选不适用于此应用程序）。

如果相关，我正在使用 VueJS。

我当前的代码：

    <p>Start typing your suburb name...</p>
    <input type="text" length="50" v-model="suburbFilter">
    <br>
    <select id="suburb-select" v-model="suburb" >
        <option v-for="suburb in filteredSuburbs">
            {{ suburb }}
        </option>
    </select>

【问题讨论】：

显示您的代码 plaese
当然。不确定它会增加多少，但还可以:)
你可以在这里使用意见表：stackoverflow.com/questions/18796221/…
谢谢，但这些是 jQuery 组件，我没有使用 jQuery。
使用js自动补全:w3schools.com/howto/howto_js_autocomplete.asp

标签： css vue.js drop-down-menu mobile-website

【解决方案1】：

我使用这个组件 https://paliari.github.io/v-autocomplete/，非常可定制

【讨论】：

【解决方案2】：

如果它始终打开，那么您可以使用<input type="radio">。

创建一个可过滤的列表，例如：https://www.w3schools.com/howto/howto_js_filter_lists.asp

然后，代替他们使用的<a> 标签，您可以设置无线电输入的样式来代替它。

【讨论】：