求一个jquery ajax请求servlet获取数据库数据,并显示在页面的例子
展开全部
假设:
1、你的页面在Web-Root下,内容为: <div id="showMsg"></div><input type="text" id="userName" />,所用编码为utf-8
2、你的servlet为: HelloWorldServlet.java 映射路径为 servlet/helloWorldServlet
步骤:
1、引入jquery-1.6.4.min.js
2、编写id为userName的输入框的点击触发函数:
$("#userName").keyup(function(){
$.ajax({
type: "post",
url: "servlet/helloWorldServlet?userName="+$(this).val(),
dataType: "json",
success: function(data){
$("#showMsg").html(data.msg);//修改id为showMsg标签的html
}, error: function(){
alert("请求出错");
}
})
})
3、后台处理接收到的内容:
request.setCharactorEncoding("utf-8");
String userName = request.getParameter("userName");
response.setCharactorEncoding("utf-8");
PringWriter out = response.getWriter();
out.print("{\"msg\":\"你好~~"+userName+"!\"}");
注意事项:
1、这里的编码统一为utf-8
2、请求路径servlet/helloWorldServlet为相对路径,因此你的页面必须在项目的Web-Root下(也就是默认的web文件夹下,名字可能因项目配置不同而改变)
3、没了,记得给分哦,打字很辛苦的~
1、你的页面在Web-Root下,内容为: <div id="showMsg"></div><input type="text" id="userName" />,所用编码为utf-8
2、你的servlet为: HelloWorldServlet.java 映射路径为 servlet/helloWorldServlet
步骤:
1、引入jquery-1.6.4.min.js
2、编写id为userName的输入框的点击触发函数:
$("#userName").keyup(function(){
$.ajax({
type: "post",
url: "servlet/helloWorldServlet?userName="+$(this).val(),
dataType: "json",
success: function(data){
$("#showMsg").html(data.msg);//修改id为showMsg标签的html
}, error: function(){
alert("请求出错");
}
})
})
3、后台处理接收到的内容:
request.setCharactorEncoding("utf-8");
String userName = request.getParameter("userName");
response.setCharactorEncoding("utf-8");
PringWriter out = response.getWriter();
out.print("{\"msg\":\"你好~~"+userName+"!\"}");
注意事项:
1、这里的编码统一为utf-8
2、请求路径servlet/helloWorldServlet为相对路径,因此你的页面必须在项目的Web-Root下(也就是默认的web文件夹下,名字可能因项目配置不同而改变)
3、没了,记得给分哦,打字很辛苦的~
更多追问追答
追问
如果我有多条数据呢?
追答
这个需要你自己去看json数据格式,以下是一个例子供你参考:
{"name":"Arthur","age":"18","result":[{"english":88,"math":"75","physics":"92"}],"other":"hahahah"}
那么,前台解析的话,要得到那个result数据,应该为:
success: function(data){
var result = data.result;
alert(result.english+" "+result.math+" "+result.physics)
})
同理,更多层,更复杂的,也是一样 x.xx.xxx.xxxx,用这种方式获取
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询