zoukankan      html  css  js  c++  java
  • JQ延时模糊查询

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=ul, initial-scale=1.0">
        <title>Document</title>
        <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    </head>
    
    <body>
        <input type="text" id="filterName">
        <ul>
            <li>545</li>
            <li>231</li>
            <li>1</li>
            <li>541</li>
            <li>4454</li>
            <li>8</li>
            <li>874</li>
            <li>6</li>
            <li>54654</li>
            <li>菜单1</li>
            <li>菜单2</li>
            <li>菜单3</li>
            <li>菜单4</li>
            <li>菜单5</li>
            <li>菜单6</li>
            <li>菜单7</li>
            <li>菜单8</li>
        </ul>
    </body>
    
    <script>
        $(function() {
            var timer;
            $("#filterName").keyup(function() {
                clearTimeout(timer);
                var that = this
                timer = setTimeout(function() {
                    $("li")
                        .hide()
                        .filter(":contains('" + ($(that).val()) + "')")
                        .show();
                }, 2000);
            });
        });
    </script>
    
    </html>
  • 相关阅读:
    网页动画
    浮动
    定位
    盒子模型
    表单
    2017年07月05号课堂笔记
    2017年07月07号课堂笔记
    2017年07月03号课堂笔记
    2017年06月30号课堂笔记
    2017年06月28号课堂笔记
  • 原文地址:https://www.cnblogs.com/123poi/p/14389635.html
Copyright © 2011-2022 走看看