这个小Demo是来区别GET与POST提交Ajax的区别.Ajax是异步的javascript与xml的调用.之前一篇博文已经介绍了Ajax的运行机制与原理.这里就直接上代码了.
1.这是我写的一个Servlet
package com.huawei.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* @name Administrator
* @date 2011-3-6
* @action AjaxServlet.java
* @time 下午05:08:54
* @package_name com.huawei.servlet
* @project_name ajaxTest
*/
public class AjaxServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {
System.out.println("doGet方式来请求");
process(request, response);
}
//抽取方法()
private void process(HttpServletRequest request,
HttpServletResponse response) throws IOException {
String v1 = request.getParameter("v1");
String v2 = request.getParameter("v2");
System.out.println("v1=" + v1 +", v2=" + v2);
String v3 =String.valueOf(Integer.valueOf(v1)+Integer.valueOf(v2));
PrintWriter out = response.getWriter();
// try {
// Thread.sleep(5000);
// } catch (InterruptedException e) {
// // TODO Auto-generated catch block
// e.printStackTrace();
// }
//System.out.println("doGet方法调用!!!");
//清空缓存的小技巧
response.setHeader("pragma", "no-cache");
response.setHeader("cache-control", "no-cache;");
out.print(v3);
out.flush();
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("doPost方式来请求");
this.process(request, response);
}
}
2.这是我写的jsp页面<script type="text/javascript"></script>中式Ajax的调用
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
<meta http-equiv="pragma" content="no-cache; charset=ISO-8859-1">
<meta http-equiv="cache-control" content="no-cache; charset=ISO-8859-1">
<title>Insert title here</title>
<script type="text/javascript">
var xmlHttpRequest = null; //声明一个空对象以接收XMLHttpRequest对象
function ajaxSubmit()
{
if(window.ActiveXObject) //IE浏览器
{
xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest) //除IE外的其他浏览器实现
{
xmlHttpRequest = new XMLHttpRequest();
}
if(null != xmlHttpRequest)
{
v1 = document.getElementById("value1ID").value;
v2 = document.getElementById("value2ID").value;
//Servlet doGet方式来请求
//xmlHttpRequest.open("GET","AjaxServlet?v1=" + v1 + "&v2=" + v2,true);
xmlHttpRequest.open("POST","AjaxServlet",true);
//关联好ajax的回调函数
xmlHttpRequest.onreadystatechange = ajaxCallback;
//真正向服务器端发送数据
//xmlHttpRequest.send(null);
//Servlet doPost方式来请求
//用doPost提交必须加上如下一行
xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttpRequest.send("v1=" + v1 + "&v2=" + v2);
}
}
function ajaxCallback()
{
if(xmlHttpRequest.readyState == 4)
{
if(xmlHttpRequest.status == 200)
{
var responseText = xmlHttpRequest.responseText;
document.getElementById("div1").innerHTML=responseText;
}
}
}
</script>
</head>
<body>
<input type="button" value="get content from server" onclick="ajaxSubmit();"><br/>
<input type="text" name="value1" id="value1ID"><br/>
<input type="text" name="value2" id="value2ID"><br/>
<div id="div1"></div>
</body>
</html>
分享到：
相关推荐
### AJAX POST 与 GET 提交的区别详解 #### 一、GET与POST基本概念及应用场景 在探讨AJAX中GET和POST的区别之前，我们先来了解一下这两种请求方式的基本概念。 **GET**请求通常用于获取资源信息，它将参数拼接到...
"Ajax中Get和Post请求的区别" Ajax作为异步JavaScript和XML的简写，是一种创建交互式网页的技术。其中，Get和Post是两种常用的HTTP请求方法，尽管它们都是用于将数据从客户端发送到服务器端，但是它们之间存在着很...
Ajax 技术中 get 与 post 两种请求方式是许多开发者经常遇到的疑问，以下将详细解释两者的区别，并提供实例代码。 一、get 与 post 的基本区别 1. 参数传递方式：get 请求将参数数据队列加到提交表单的 ACTION ...
Java 模拟Ajax POST GET 提交代码,实测很好用。
本文将详细讲解如何使用Ajax以GET和POST方式调用WCF服务，包括带参数和不带参数的情况。 首先，我们需要理解Ajax的基本原理。Ajax通过JavaScript创建XMLHttpRequest对象，然后利用这个对象与服务器进行异步通信。...
1. jQuery的$.get和$.post方法：这两种方法是jQuery提供的Ajax（异步JavaScript和XML）接口，用于与服务器进行非刷新的数据交换。$.get用于发送GET请求，而$.post用于发送POST请求。它们都接受四个参数：URL、数据、...
表单的`method`属性可以设置为"POST"或"GET"，决定提交方式。 2. **jQuery监听表单提交**：使用jQuery，我们可以监听表单的提交事件，比如`$('form').submit(function(event) { ... })`，阻止默认的表单提交行为...
**GET与POST的区别** 1. **数据位置**：GET将数据附加到URL，POST将数据放在请求体中。 2. **数据大小**：GET受限于URL长度（约2KB），POST无明显限制。 3. **安全性**：GET请求的数据会出现在浏览器的历史记录和...
ajax总结，load，get,post,ajax总结，还有formdata~~~
2. Ajax的GET和POST请求实现。 3. 解决Ajax请求中文乱码问题。 4. PHP接收和发送JSON数据。 5. 结合MySQL数据库进行数据交互。 通过这个实例，开发者可以学习到如何创建一个能够动态获取和提交数据的Web应用，同时...
一个类实现 AJAX， 支持POST与GET提交
在ajax中使用post方法，用常规的参数格式：param1=a1¶m2=a2 ，当参数长度过长时，依然提交不成功。比如我们经常这样写一个ajax的post请求： $.ajax({ type: "post", // post or get contentType:"application...
通过设置`method`属性，我们可以指定表单使用GET还是POST方式提交数据。例如： ```html <form action="your-api-url" method="post"> <!-- 输入字段 --> <!-- 提交按钮 --> 提交 ``` 对于POST请求，特别是...
本篇文章将深入探讨jQuery中的ajax、post、get方法以及如何使用json格式传递数据。 1. **jQuery的$.ajax()函数** `$.ajax()`是jQuery提供的核心Ajax功能，它可以实现异步数据交互。通过配置各种参数，可以灵活地...
在这个教程中，我们将深入探讨AJAX的GET和POST提交方式，以及它们在实现用户名搜索功能时的区别，同时也会解决可能出现的中文乱码问题和缓存问题。 首先，GET和POST是HTTP协议中的两种主要请求方法，它们在AJAX中...
封装jquery ajax方法，方便调用，避免在代码中频繁使用 $.ajax({ type: 'GET', url: url, ...... )}; 统一调用公共方法即可，区分同步异步，get post！希望对大家有帮助
与GET方式不同，POST请求的数据不会出现在URL中，而是包含在请求体中。这使得POST方式能处理大量数据或敏感信息，因为它们不会被浏览器记录或缓存。 2. **创建POST表单** 在HTML中，通过`<form>`标签可以创建一个...
而Jquery库提供了一系列封装好的Ajax函数，如$.get(), $.post(), $.ajax(), 和$.getJSON()，这些函数简化了前端开发者与后端数据交互的过程。 ### 1. $.get() `$.get()`函数是最简单的一种异步请求方式，它发送一...
$.get()和$.post()方法 、 $.getScript()和$.getJson() 、 $.ajax()方法 、 序列化元素 、 jQuery中的Ajax全局事件 这些都有详尽的例子，一看代码，你就能明白jquery里实现ajax是怎么回事了，简单明了。