怎么使用js技术实现文字搜索匹配啊？

我想写这个的jsp但是不知道怎么写这里的代码求大神帮助

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

这样的功能吗？keyup　的时候　获取输入框的值，ajax到后台查询匹配的返回过来，再在success中把返回过来的加入到输入框下面div中。显示出来。
那这些数据怎么经过上面的select里面的option筛选呢？option的onclick事件要写上面函数呀？
我并不是用的option。　而是ul,li。ul相对于searchinput定位。根据返回的数据填充li到ul中。当然，点击li的时候会把那一项的内容放入输入框。　至于要不要直接搜索还是点按钮才搜索要你自己决定。 <div class="searchinput">
<input  type="text"  class="user_loadq cz_top_input" style="width:169px;" >
<ul class="searchmore" id="searchmore">
</ul>
<div class="clearfloat"></div>
</div>
jquery代码：         $(document).ready(function(){
         $(".user_loadq").keyup(function(){//搜索
         var uname = trim($(this).val());
         if(uname.length >= 1){
         $.getJSON('action/theaction.php?type=search&q='+uname,null,function (data) {
         var item;
         $(".searchmore").empty();//清空原来的ul
         if(data.res !=null){
         $.each(data.res,function(i,res){//循环加入到ul中去
         item = "<li>"+res+"<li>";
         $(".searchmore").append(item);
         })
         $(".searchmore").show();
         }else{
         $(".searchmore").hide();
         }
         });
         }else{
         $(".searchmore").hide();
         }
         })
         $(document).on("click", ".searchmore li", function(){
         $(".user_loadq").val(trim($(this).text()));
         $(".searchmore").hide();
         });         $(".searchinput").mouseleave(function(){
         $(".searchmore").hide();
         })         })
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>MyHtml.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

      </head>

  <body>
    <input type="text" id="vstext" placeholder="请输入1"/>
<ul id="vsul"></ul>
  </body>
  <script src="jquery-1.7.2.min.js"></script>
  <script>
  var arr = ["1","2","3","11","123","56"];
  $("#vstext").keyup(function() {
$("#vsul li").remove();
   var vl = $("#vstext").val();
if(vl==""){
return false;
}
   $(arr).each(function(index){
if(this.indexOf(vl)>=0){
$("#vsul").append("<li>"+this+"</li>");
}
});
  });
  </script>
</html>