您的位置:首页 > Web前端 > JQuery

使用jquery 的ajax 与 Java servlet的交互代码实例

2020-03-11 17:51 232 查看

这篇文章主要介绍了使用jquery 的ajax 与 Java servlet的交互代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

由于是使用jquery的 所以别忘记导入jq

下面是jsp文件

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="js/jquery-3.3.1.js"></script>
<script type="text/javascript">
function ajaxFun(){
$.ajax({
type: "POST",              //传数据的方式
url: "user",               //servlet地址

data: $('#form').serialize(),      //传的数据 form表单 里面的数据
success: function(result){        //传数据成功之后的操作  result是servlet传过来的数据 这个函数对result进行处理,让它显示在 输入框中
$("#results").val(result);      //找到输入框 并且将result的值 传进去
}
});
}

</script>
</head>
<body>
<H1 align="center">请输入两个字符串</H1>
<div align="center">
<form id="form">
first:<input type="text" name="first" id="first">
second:<input type="text" name="second" id="second"><br data-filtered="filtered">     //点击按钮的时候触发属性
<button type="button" onclick="ajaxFun()">button</button> //提交 按钮
</form>
<input type="text" id="results">
// 用来 显示 result
</div>
</body>
</html>

然后是 servlet 文件

package com.java.servlet;
import java.io.IOException;
import java.io.PrintWriter;
/**
* Ajax 训练
* */
public class UserServlet extends javax.servlet.http.HttpServlet {
protected void doPost(javax.servlet.http.HttpServletRequest request, javax.servlet.http.HttpServletResponse response) throws javax.servlet.ServletException, IOException {
this.doGet(request,response);
}
protected void doGet(javax.servlet.http.HttpServletRequest request, javax.servlet.http.HttpServletResponse response) throws javax.servlet.ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("UTF-8");
PrintWriter out = response.getWriter();
String first = request.getParameter("first");      //从前端获取数据first
String second = request.getParameter("second");     //从前端获取数据second
String result=first+second;
System.out.println(result);                   //用于测试 ,判断是否成功获取到数据;
out.println(result);                         //将数据传到前端
}
}

以上就是本文的全部内容,希望对大家的学习有所帮助

您可能感兴趣的文章:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquery ajax java servlet 交互