Question

你能否告诉我如何在jquery中过滤keydown事件列表？我想让autocomplete按input字段过滤我的列表 这是我的代码

https://jsbin.com/wamaficase/edit?html,js,output

 $(function () {
        $('#user').keyup(function (e) {
            var $item =$('#item li');
            var val =this.value;
            var $newItem =$item.filter(function (i,item) {
                console.log($(item).text())
                return $(item).text().indexOf(val)!= -1;
            })
            console.log($newItem)
        });

    });

我在newItem变量中获取了如何在视图中显示的更新列表？

预期

当用户输入h时，它会在列表中显示hello ,bhnm,chuy项

Answer 1

我使用jQuery在这些列表项上切换隐藏的类，只渲染那些具有类型文本的类。

＆＃13;

.hidden {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://code.jquery.com/jquery-2.1.4.js"></script>

</head>

<body>
  <div>
    <input type="text" id="user" />
  </div>
  <ul id="item">
    <li class='hidden'>hello</li>
    <li class='hidden'>pwny</li>
    <li class='hidden'>chuy</li>
    <li class='hidden'>myuio</li>
    <li class='hidden'>bhnm</li>
    <li class='hidden'>ssd</li>
    <li class='hidden'>iopo</li>
  </ul>
</body>

</html>

＆＃13;

List<List<Integer>>

＆＃13;

如何在jquery中的keydown事件上过滤列表？

1 个答案: