javascript搜索框

搜索javascript

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <script type="text/javascript" src='http://code.jquery.com/jquery-1.11.0-beta1.js'></script>
    </head>
    <body>
    <div id="search">
    <input type="text" id='key-word'>
    <button id="searchbtn" onclick="search()">搜索</button>
    </div>
    <hr />
    <div id="news">
    <div><img src="image/contentlist.gif"><a href="#" name="n">[最新动态]来自星星的你</a></div>
    <div><img src="image/contentlist.gif"><a href="#" name="n">[最新动态]都敏俊xi</a></div>
    <div><img src="image/contentlist.gif"><a href="#" name="n">[最新动态]福州大学至诚学院</a></div>
    </div> <script>
    function search(){

    var ser = $.trim($("#key-word").val());
    var reg = eval('/'+ser+'/'); if(ser.length < 1 ){
    $("#news > div").show();
    }else{
    $("#news div").hide();

    $("#news a").each(function(key,val){
    var atext = $(val).text();

    if(reg.test(atext)){

    $("#news div").eq(key).show();
    }
    })
    }
    }
    </script>
    </body>
    </html>