<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

<title>This is my JSP page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<style type="text/css">
div{
border: 1px solid red;
width: 400px;
height: 300px;
}
</style>
</head>

<body>
<input type="button" value="Ajax" onclick="testAjax()">
<div id="msg"></div>
</body>
<script type="text/javascript">

function testAjax(){
//document.getElementById("msg").innerHTML = "加载中...";
//id;
var request;
//创建 request对象
if(window.XMLHttpRequest){ //兼容性
request = new XMLHttpRequest();
}else if(window.ActiveXObject){ //针对IE
request = new ActiveXObject("Msxml2.XMLHTTP");
}

//写监听 去check request的状态
request.onreadystatechange = function(){
//
//console.log(request.readyState);
if(request.readyState == 4){
//得到 后台写出的数据

//当加载成功以后
if(request.status == 200){
//得到的的是一个json字符串
var data = request.responseText;
//将json字符串转换为json对象
eval("data = "+data);
document.getElementById("msg").innerHTML = data.password;
}else if(request.status == 404){
document.getElementById("msg").innerHTML = "资源没有找到";
}else if(request.status == 500){
document.getElementById("msg").innerHTML = "服务器错误";
}

}else{
document.getElementById("msg").innerHTML = "<img src=\"images/loading.gif\" />";
}
};

//打开请求
//如果在 地址栏上面 的参数 的值中包含 # 应该将其编码 然后在传递
request.open("post", "ajax/ajaxController?name="+encodeURIComponent("lisi#123")+"&d="+new Date().getTime());
//encodeURIComponent(uriComponent)
//发送数据
//如果没有数据 则写null 不然 其他浏览器可能会报错

//如果在 send方法中传参数 则一定要设置 请求头信息中的 Content-Type 为 application/x-www-form-urlencoded
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

//如果是 post传参 他和 参数的组织方式 是有关系的
request.send("username=lisi#123&age=123");
}

</script>
</html>

ajax的post请求方式的更多相关文章

  1. AJAX中的请求方式以及同步异步的区别

    AJAX中的请求方式以及同步异步的区别请求方式,分为GET与POST: GET 最为常见的HTTP请求,普通上网浏览页面就是GET.GET方式的参数请求直接跟在URL后,以问号开始.(JS中用wind ...

  2. jQuery中的Ajax几种请求方式

    1. load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中. url (String) : 请求的HTML页的URL地址. data (M ...

  3. 利用Ajax改变发送请求方式

    由于测试的时候需要模拟Head请求,解决办法:先访问要请求的站点,然后在浏览器的控制台下执行如下代码,请求方式就为参数给的值: var xmlHttp; if (window.ActiveXObjec ...

  4. ajax使用jsonp请求方式

    /* //简写形式,效果相同 $.getJSON("http://app.example.com/base/json.do?sid=1494&busiId=101&jsonp ...

  5. 4种常用的Ajax请求方式

    在jQuery中,AJAX常见的请求方式主要有一下4种: 1.$.ajax()返回其创建的 XMLHttpRequest 对象 $.ajax() 只有一个参数:参数key/value对象,包含各配置及 ...

  6. Ajax学习系列——jQuery中Ajax的请求方式

    在jQuery中,Ajax常见的请求方式主要有4种. 1.$.ajax()返回其创建的XMLHttpRequest对象. $.ajax({ type:"POST", content ...

  7. jQuery ajax跨域请求的解决方法

    在Ajax应用中,jQuery的Ajax请求是非常容易而且方便的,但是初学者经常会犯一个错误,那就是Ajax请求的url不是本地或者同一个服务器下面的URI,最后导致虽然请求200,但是不会返回任何数 ...

  8. JQuery书写Ajax的几种方式?

    1 $.ajax({ type: "Post", //请求方式 ("POST" 或 "GET"), 默认为 "GET" ...

  9. jquery的ajax和原始的ajax这两种方式的使用方法

    jquery的ajax是对原始的ajax进行的封装,方便用户的使用.下面用代码分别举例各自的使用方式. jquery的ajax发送和接收xml数据格式. $.ajax({ type: "PU ...

随机推荐

  1. PHP:第六章——02正则基本语法

    <?php header("Content-Type:text/html;charset=utf-8"); //正则表达式的基本结构:匹配符.匹配模式.模式修饰符 //元字符 ...

  2. hdu 6158 The Designer（ 反演圆）

    The Designer Time Limit: 8000/4000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tota ...

  3. <NET CLR via c# 第4版>笔记 第8章 方法

    8.1 实例构造器和类(引用类型) 构造引用类型的对象时,在调用类型的实例构造器之前,为对象分配的内存总是先被归零 .没有被构造器显式重写的所有字段都保证获得 0 或 null 值. 构造器不能被继承 ...

  4. Alpha阶段第1周 Scrum立会报告+燃尽图 07

    作业要求与https://edu.cnblogs.com/campus/nenu/2018fall/homework/2246相同 一.小组介绍 组长:刘莹莹 组员:朱珅莹 孙韦男 祝玮琦 王玉潘 周 ...

  5. I.MX6 Linux U-boot 环境变量解析

    /********************************************************************************** * I.MX6 Linux U- ...

  6. js字符串的裁剪

    一.JavaScript字符串的处理方法 1.split()  功能:使用一个指定的分隔符把一个字符串分割存储到数组 例子:   str=”jpg|bmp|gif|ico|png”; arr=str. ...

  7. BZOJ3211: 花神游历各国（线段树）

    3211: 花神游历各国 Time Limit: 5 Sec  Memory Limit: 128 MBSubmit: 5692  Solved: 2114[Submit][Status][Discu ...

  8. Struts2自定义标签4自定义分页标签

    第一步:webroot/web-inf下的str.tld文件 <?xml version="1.0" encoding="UTF-8"?> < ...

  9. debian下为apache启用rewrite模块

    如果我们是自己编译的apache,那么启用或禁用某个模块应该说是比较容易的事,只要修改apache的配置文件就可以了.但是我们没有理由不用已经做好的二进制文件进行安装,使用apt-get要方便多了. ...

  10. am335x内核初始化路径

    /arch/arm/mach-omap2/board_am335xevm.c中 1.myd_am335x_dev_cfg[]{ evm_nand_init() ... myir_gpio_init() ...