jQuery ajax方法
jQuery ajax方法
别团等shy哥发育
发布于 2023-02-25 17:26:42
发布于 2023-02-25 17:26:42
代码可运行
运行总次数：0
代码可运行
1、新建一个ajax.html页面
我们通过点击按钮执行ajax方法，将提交的数据显示在上图下面那个div中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<style type="text/css">
#time,#res{
width: 300px;
height: 100px;
border: 1px solid #f00;
}
</style>
</head>
<body>
<button id="btn">ajax方法</button>
<div id="time"></div>
<div id="res"></div>
<script type="text/javascript">
$(function () {
var time=new Date();
$('#time').html(time.getHours()+":"+time.getMinutes()+":"+time.getSeconds());
$('#btn').click(function () {
$.ajax({
url:"post",
data:{name:'lisi',age:'30'},
type:"post",
success:function (data) {
$('#res').html(data.res);
},
dataType:"json"
});
});
});
</script>
</body>
</html>参数解释
url:发送请求的地址
data:发送到服务器的数据。将自动转换为请求字符串格式。
type:请求方式 ("POST" 或 "GET")， 默认为 "GET"。
success:请求成功后的回调函数。参数：由服务器返回，并根据
dataType参数进行处理后的数据；描述状态的字符串
dataType:预期服务器返回的数据类型。2、新建一个servlet
package com.qf;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
@WebServlet("/post")
public class PostTest extends HttpServlet {
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String name=req.getParameter("name");
String age = req.getParameter("age");
System.out.println("age="+age);
System.out.println("name="+name);
PrintWriter writer = resp.getWriter();
String json="{\"res\":\"success\"}";
writer.write(json);
}
}这里我们将数据按照json格式返回
3、部署项目：
点击ajax方法之后：
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2020-12-12，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
