jQuery+ajax实现搜索下拉菜单

最新推荐文章于 2024-09-07 22:49:05 发布

不争气争口馒头

最新推荐文章于 2024-09-07 22:49:05 发布

阅读量3.5k

点赞数 1

分类专栏：前端

本文链接：https://blog.csdn.net/qq_29376717/article/details/78155207

版权

本文介绍如何利用jQuery和Ajax技术实现在输入框中输入时动态加载搜索建议，展示下拉菜单效果，提升网页交互体验。

摘要由CSDN通过智能技术生成

jsp页面代码

<input id="search_input" type="text" οnkeyup="test(this.value,event)" οnkeypress="test3()"/>

<select  multiple="multiple" id="sel" οnchange="test2()" style="width:300px;display:none;color:gray" 
</select>

js代码

function test(keyword,event){  
		
        //定义全局变量  
        var keyword = $("#search_input").val();   
        var sel = document.getElementById("sel"); 
        var regExp = new RegExp(keyword, "g");//创建正则表达式，g表示全局的，如果不用g，则查找到第一个就不会继续向下查找了；
        $.getJSON(       
                "/blog/user/select",//url  
                "keyword="+ keyword,//发送的数据  
                function(data){//获取响应回来的数据