jQueryAjax++servlet+json实现页面加载时从后台读取数据
在eclipse中新建一个项目,我起名为Demo
新建一个html文件,在其中引入外部jQuery和自定义的js文件
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript" src="js.js"></script>
<title>Insert title here</title>
</head>
<body>
</body>
</html>
新建一个servlet,使用doPost()方法,在其中手动写一个json字符串,并将传输文件类型设置为json,传输字符编码设置为utf-8,将浏览器解析方式设置为utf-8
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String jsonStr="{\"dataStr\":\"我是json!\"}";//双引号之前的\代表将后面的双引号转义,不会使它和前面的双引号匹配
response.setContentType("application/json;charset=utf-8");
response.setCharacterEncoding("utf-8");//设置浏览器按utf-8格式解析
response.getWriter().write(jsonStr);//发送响应
}
在自定义的js中写拿回后台数据之后的逻辑,这里为了简单,直接在网页上弹出提示框像是数据
$(document).ready(function()
{
$.ajax({
type:"post",
url:"http://localhost:8080/Demo/DemoSer",
async:true,
data:{},
success:function(data)//成功取回数据之后的回调函数
{
alert("传回的数据是:"+data.dataStr);
},
error:function()//没能取回数据之后的回调函数
{
alert("请求失败!");
}
});
});
部署项目,启动服务器,打开网页: