下拉菜单中的ajax

来源：互联网发布：linux 复制多行编辑：程序博客网时间：2024/06/05 14:49
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.min.js"></script><script type="text/javascript">$(function(){$("#c").keyup(function(e){$.post("${pageContext.request.contextPath}/ajax/nickname","nickname="+$("#c").val(),function(a){//清除提示框中的旧信息$("tbody").empty();//获取输入框中的文本var txt=$("#c").val();if(txt.length>0){//从数据源中检索相关数据for(var i=0;i<a.length;i++){//相关//if(a[i].indexOf(txt)>=0){$("tbody").append("<tr>"+"<td>"+a[i].username+"</td>"+  "</tr>");//}}$("div").slideDown(200);}else{//隐藏提示框$("div").hide();}//为提示框中的提示项增加效果$("tbody").on("mouseover","tr",function(){$(this).css("background-color","#abcdef");});$("tbody").on("mouseout","tr",function(){$(this).css("background-color","#ffffff");});//为提示框中的提示项增加单击事件$("tbody").on("click","tr",function(){//将当前tr中的text设置给文本框var msg=$(this).text();$("#c").val(msg);//隐藏提示框$("div").hide();});},"json");});});</script><body><center><input id="c" type="text" style="width:202px;margin-bottom:0"/><div style="display:none;border:1px solid gray;width:200px"><table style="width:200px"><tbody></tbody></table></div></center></body>//模糊查询public String getMessageUsername(){list = ms.queryMessageUsername(nickname);//序列化Object json = JSON.toJSON(list);HttpServletResponse response = ServletActionContext.getResponse();response.setCharacterEncoding("utf-8");try {response.getWriter().print(json);response.getWriter().flush();response.getWriter().close();} catch (IOException e) {e.printStackTrace();}return null;}
0 0