java ajax post_2、Ajax与Java通过POST方式交互
1、关于Ajax交互的步骤
1.1 获取到xmlhttprequest
1.2 设置xmlhttprequest的onreadystatechange响应事件
1.3 准备获取ajax请求 xmlhttp.open("POST", "AjaxServerlet", true);
1.4 设置消息头为表单形式,模仿表单的POSt提交xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
1.5 发送ajax请求xmlhttp.send("age=18&name=zhang"); //Ajax的POST请求,参数是通过xmlhttp.send()方法携带的
1.6 处理Ajax交互获取到的数据,具体的处理在xmlhttprequest的onreadystatechange响应事件中实现
2、Ajax与Java的Servlet通过POSt交互
2.1
html代码
点击
2.2 JavaScript代码
//1、获取到xmlhttprequest
function getXmlhttp() {
var xmlhttp;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlhttp;
}
window.onload = function() {
document.getElementById('mybtn').onclick = function() {
//1、获取到xmlhttprequest 对象
var xmlhttp = getXmlhttp();
//2、xmlhttprequest的响应事件
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
//5、操作获取到的信息
//5.1ajax返回的数据,转换为javascript对象
// 5.1.1 利用eval实现转换
var ajaxResult = eval("(" + xmlhttp.responseText + ")");
//5.1.2 利用jquery的方法,对于jQuery.parseJSON(),键值必须为双引号
/* var ajaxResult = jQuery.parseJSON(xmlhttp.responseText); */
alert(ajaxResult)
//5.2获取JavaScript对象的属性
var age = ajaxResult.age;
var name = ajaxResult.name;
//5.3获取到页面的DIV,并设置内容
var mydiv = document.getElementById("myAjax");
mydiv.innerHTML = "name:" + name + "," + "age:" + age;
}
}
//3、准备获取ajax请求
//3.1 对于get请求,带参数的方式,直接在open函数的请求地址带上参数
xmlhttp.open("POST", "AjaxServerlet", true);
//4、发送ajax请求
xmlhttp.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xmlhttp.send("age=18&name=zhang");
};
}
2.3 style代码
#myAjax {
width: 400px;
height: 400px;
border: 1px dashed red;
text-align: center; /* div中的文字水平方向居中显示 */
line-height: 400px; /*这个和div的高度相同,div中的文字就会垂直方向居中显示 */
font-size: 16px;
font-weight: bold;
}
2.4 AjaxServerlet.java代码
public class AjaxServerlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String age = request.getParameter("age");
String name = request.getParameter("name");
Person person = new Person(name, age);
String personJSON = "{\"name" + "\":\"" + name + "\"," + "\"age"
+ "\":" + age + "}";
System.out.println(personJSON);
response.getWriter().write(personJSON);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}2.5web.xml代码
AjaxServerlet
com.ajax.com.AjaxServerlet
AjaxServerlet
/AjaxServerlet
index.html
原文:http://blog.csdn.net/zbw18297786698/article/details/51330357
java ajax post_2、Ajax与Java通过POST方式交互相关推荐
- 面向 Java 开发人员的 Ajax: 构建动态的 Java 应用程序
面向 Java 开发人员的 Ajax: 构建动态的 Java 应用程序 Ajax 为更好的 Web 应用程序铺平了道路 在 Web 应用程序开发中,页面重载循环是最大的一个使用障碍,对于 Java™ ...
- java原生封装_[Java教程]原生AJAX封装
[Java教程]原生AJAX封装 0 2016-07-12 13:00:08 回归下原生js,网上看到的AJAX封装,遂拿来改改,不知还有何弊端,望指出!1 var ajaxHelper = { 2 ...
- java中ajax由哪些组成,java中ajax
java中ajax [2021-02-01 14:57:40] 简介: php去除nbsp的方法:首先创建一个PHP代码示例文件:然后通过"preg_replace("/(\s| ...
- ajax json的参数,java ajax json参数
java ajax json参数 [2021-02-02 08:55:23] 简介: php去除nbsp的方法:首先创建一个PHP代码示例文件:然后通过"preg_replace(&quo ...
- java jquery ajax_[Java教程]jquery ajax 使用
[Java教程]jquery ajax 使用 0 2015-01-09 11:00:12 异步刷新实现方式有多种,也可以借助JS的多种框架,下面是使用JQuery框架实现的AJAX 验证用户名是否存在 ...
- Java过滤器处理Ajax请求,Java拦截器处理Ajax请求,java 判断请求是不是ajax请求
Java过滤器处理Ajax请求,Java拦截器处理Ajax请求,java 判断请求是不是ajax请求 Java过滤器处理Ajax请求,Java拦截器处理Ajax请求,拦截器Ajax请求 java 判断 ...
- ajax调用后台java方法,jquery ajax再次封装,前台调用后台java方法直接返回数据
一,前台js部分代码 /** * bean参数格式:类全限定名.方法名 opt参数格式:键值对 handleResponse:会function类型参数包含一个参数data,为后台返回json数据 ...
- java中ajax是什么意思,java中使用Ajax技术
ajax技术是使页面能局部刷新的一种技术,全称应该是asynchronous JavaScript and xml从几个单词就知道它的请求响应的处理是异步的,而且使用的是JavaScript和xml技 ...
- 基于javaweb的水果店商城超市系统(java+ssm+jsp+ajax+jquery+mysql)
基于javaweb的水果店商城超市系统(java+ssm+jsp+ajax+jquery+mysql) 运行环境 Java≥8.MySQL≥5.7.Tomcat≥8 开发工具 eclipse/idea ...
- java接口支持ajax,【JavaWeb】jQuery对Ajax的支持
jQuery对Ajax的支持 jQuery对Ajax进行封装,提供了$.ajax()方法 语法:$.ajax(options) 常用设置项 说明 url 发送请求地址 type 请求类型get|pos ...
最新文章
- C ++变量,文字和常量
- UOJ#7. 【NOI2014】购票 | 线段树 凸包优化DP
- sql server的BCP导入导出(转)
- Ubuntu18.04安装Intel® oneAPI Toolkit
- c++的引用是什么意思?怎么回事?
- ajax隐藏button,jquery下的ajax应用-form和button触发
- MySQL必知必会——了解SQL/SQL简介/使用MySQL
- springboot教程-web(二)
- IBASE save error
- asp与php对比,ASP和PHP文件操作速度的对比
- 撸了个搜索引擎系统,爽!
- raw socket
- python调用cmd执行命令_python怎么运行cmd命令
- 【ELMAN回归预测】基于matlab鲸鱼算法优化ELMAN回归预测【含Matlab源码 1667期】
- QT 任务栏图标显示问题
- 2020年,技术圈十大“翻车”事件!
- python sql语句换行_python一行sql太长折成多行并且有多个参数的方法
- Ventoy:u盘制作,usb启动盘,超级好用的装机神器
- mysql优化经验_中国移动MySQL数据库优化经验
- 分类决策树考虑了经验风险吗_数据挖掘导论 第4章 分类:基本概念、决策树与模型评估...
热门文章
- Codeforces Round #481 (Div. 3)【完结】
- ConcurrentMap接口
- 把我坑惨的一个MySQL双引号!
- 蓝桥杯-字串统计(java)
- BigDecimal add方法问题:调用add后,求和结果没变
- anglarjs引入HTML头,请问怎么在html引入angularjs?
- 中fuse_一个Fanotify和FUSE配合使用导致的问题
- Struts2 文件下载
- 关于Oracle Insert 语句的子查询 和 with check option的用法
- Spring事务的处理流程、传播属性、及部分释疑