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("请求失败！");}});});

部署项目，启动服务器，打开网页：

在这里插入图片描述

jQueryAjax++servlet+json实现页面加载时从后台读取数据

成功！