如何通过HTML下拉列表或选择元素实现自动完成功能? [英] How to achieve autocomplete feature over HTML drop-down or select element?

查看:105
本文介绍了如何通过HTML下拉列表或选择元素实现自动完成功能?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试为下拉列表或选择 html表单元素创建auto completion功能.

Hi I am trying to create auto completion functionality for a drop-down OR select html form element.

我需要一种功能,例如一旦用户根据drop-down/select元素在drop-down/select元素上启动typing,它就会以特定下拉列表中 selected元素的形式出现/选择项目.

I need a functionality like once user start typing on a drop-down/select element according to it's match able element would be come up in-form of selected element of a specific drop-down/select item.

任何人都知道我如何实现这一目标吗?

推荐答案

您可以使用jQuery select2插件.只需使 HTML 选择框即可自动完成: Select2

You can use jQuery select2 plugin. It simply make HTML Select box to Auto Complete: Select2

<link 
href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.css" 
rel="stylesheet" />
<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<script 

src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
    $(".js-example-basic-multiple").select2();
});
</script>

<select class="js-example-basic-multiple" multiple="multiple">
    <option value="AL">Alabama</option>
    <option value="WY">Wyoming</option>
</select>

这篇关于如何通过HTML下拉列表或选择元素实现自动完成功能?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆