搜索框自动检索

最新推荐文章于 2024-06-23 13:02:30 发布

weixin_30316097

最新推荐文章于 2024-06-23 13:02:30 发布

阅读量427

点赞数 1

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/zcboy/p/7210113.html

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>struts</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">

</head>

<body>
名字：<input id="seach" />
<br/><br/>
<div id="div"></div>

<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
    var user=[{"id": 1, "name": "张三","age":"25"},
        {"id": 2, "name": "李四","age":"35"},
        {"id": 3, "name": "王五","age":"20"}];
    $(document).ready(function() {
        var seach = $("#seach");
        seach.keyup(function (event) {
            var seachText = $("#seach").val();
            if (seachText != "") {
                var tab = "<div>查询结果：</div>";
                $.each(user, function (id, item) {
                    if (item.name.indexOf(seachText) != -1) {
                        tab += "<div>"+ item.name + "</div>";
                    }
                });
                tab += "</table>";
                $("#div").html(tab);
                tab = "<div>123</div>";
            } else {
                $("#div").html("");
            }
        });
    })
</script>
</body>
</html>