JS编写input搜索框，类似下拉搜索框

原创

于 2017-02-23 11:56:56 发布 · 5.4k 阅读

7 ·

CC 4.0 BY-SA版权

本文介绍了在jQuery 1.4.4版本下，由于版本过低无法使用现有框架，因此作者自行编写了一个简易的下拉搜索框。提供的代码经过验证，在IE浏览器中可能需要针对不支持forearch的情况进行调整。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

因为工作需求，要在一个OA系统嵌入页面，查询相关OA系统的jquery版本，是1.4.4，版本过低，没办法引用现有的优秀的下拉搜索框的框架，导致需要自己写一个简易的下拉搜索框。代码如下，亲测，有效：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        ul#drop {
            list-style: none;
            margin: 0;
            padding: 0;
        }
        ul#drop li {
            
            margin: 0;
            padding: 10px;
        }

        ul#drop li:hover {
            background-color: darkgrey;
			width:200px;
        }

        p#selectedId {
            display: inline-block;
        }

    </style>

    <script>

        // 临时数据

        var data1 = ["1d412155279b4c0b90571991f8e37cde", "17173(17173)"];
        var data2 =