一种 jquery 检索方案

整理自：http://www.cnblogs.com/linjiqin/archive/2011/03/18/1988464.html

DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
html>
head>
title>struts2title>
meta http-equiv="pragma" content="no-cache">
meta http-equiv="cache-control" content="no-cache">
meta http-equiv="expires" content="0">
script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js">script>
script type="text/javascript">
//数据源，json的格式.
var user=[{"id": 1, "name": "张三","age":"25"},
{"id": 2, "name": "李四","age":"35"},
{"id": 3, "name": "王五","age":"20"},
{"id": 4, "name": "老王","age":"20"},
{"id": 5, "name": "老张","age":"25"},
{"id": 6, "name": "李四","age":"35"},
{"id": 7, "name": "王五","age":"20"},
{"id": 8, "name": "老王","age":"20"},
{"id": 9, "name": "abc","age":"25"},
{"id": 10, "name": "李b四","age":"35"},
{"id": 11, "name": "125","age":"20"},
{"id": 12, "name": "246","age":"20"},
{"id": 13, "name": "张三","age":"25"},
{"id": 14, "name": "李四","age":"35"},
{"id": 15, "name": "王五","age":"20"},
{"id": 16, "name": "老王","age":"20"},
{"id": 17, "name": "张三","age":"25"},
{"id": 18, "name": "李四","age":"35"},
{"id": 19, "name": "王五","age":"20"},
{"id": 20, "name": "老王","age":"20"}];
$(document).ready(function(){
        var seach=$("#seach");
        seach.keyup(function(event){
            //var keyEvent=event || window.event;   
            //var keyCode=keyEvent.keyCode;  
            // 数字键：48-57
            // 字母键：65-90
            // 删除键：8
            // 后删除键：46
            // 退格键：32
            // enter键：13  
            //if((keyCode>=48&&keyCode=65&&keyCode
            //获取当前文本框的值
            var seachText=$("#seach").val();
            if(seachText!=""){
            //构造显示页面
            var tab="";
            //遍历解析json            $.each(user,function(id, item){
                //如果包含则为table赋值if(item.name.indexOf(seachText)!=-1){
                tab+="";
                }
                })
            tab+="


编号
名称
年龄



                


"+item.id+"


"+item.name+"


"+item.age+"


";
            $("#div").html(tab);
            //重新覆盖掉，不然会追加
            tab="";
            }else{
                $("#div").html("");
            }
            // }        })
});
script>head>body>
名字：input id="seach" />
br/>br/>
div id="div">div>
body>
html>

 
一种 jquery 检索方案,搜素材,soscw.com
一种 jquery 检索方案
标签：style   blog   http   java   color   width   
原文地址：http://www.cnblogs.com/nigang/p/3794700.html


编号
名称
年龄