Ajax学习笔记(三)
来源:互联网 发布:vb的九九乘法表 编辑:程序博客网 时间:2024/06/08 02:01
JSON: json.js需要到www.json.org网站上去下 json为一种文本格式 是名/值对的集合 和xml差不多
但编码比xml要简短。如:var temp={"name":"tangjun","age",20} 要获得数据可以temp.name
下面示例:(tomcat)
Java文件:PostData.java
package ajax;
import java.io.*;
import javax.servlet.ServletException;
import javax.servlet.http.*;
import net.sf.json.JSONObject;
public class PostData extends HttpServlet
{
private static final String CONTENT_TYPE = "text/html; charset=GBK";
public PostData()
{
}
public void init()
throws ServletException
{
}
public void doGet(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException
{
res.setContentType("text/html; charset=GBK");
StringBuffer data = new StringBuffer();
String temp = null;
try
{
req.setCharacterEncoding("UTF-8");
res.setCharacterEncoding("UTF-8");
BufferedReader reade = req.getReader();
while((temp = reade.readLine()) != null)
data.append(temp);
JSONObject jsonobj = new JSONObject(data.toString());
res.setContentType("text/xml");
res.getWriter().print((new StringBuilder()).append("你的注册信息:姓名:").append(jsonobj.getString("name")).append(",年龄:").append(jsonobj.getInt("age")).append(",性别:").append(jsonobj.getString("sex")).append(",你喜欢的颜色:").append(jsonobj.getString("loveColor")).append(".").toString());
}
catch(Exception e)
{
System.out.println(e.toString());
}
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException
{
doGet(request, response);
}
public void destroy()
{
}
}
html文件:test.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>动态查询显示结果</title>
<script type="text/javascript" src="json.js"></script>
<script type="text/javascript">
var xmlHttp;
function createXMLHTTPRequest()
{
if(window.ActiveXObject)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest)
{
xmlHttp=new XMLHttpRequest();
}
}
function doJson()
{
createXMLHTTPRequest();
var url="postdata?timeStamp="+(new Date()).getTime();
var name=document.getElementById("name").value;
var age=document.getElementById("age").value;
var sex=document.getElementById("sex").value;
var loveColor=document.getElementById("loveColor").value;
if(name=="" || name==null)
{
name="唐俊";
}
if(age=="" || age==null)
{
age="20";
}
if(sex=="" || sex==null)
{
sex="男";
}
if(loveColor=="" || loveColor==null)
{
loveColor="蓝色";
}
var carAsJson=JSON.stringify(new People(name,age,sex,loveColor));
xmlHttp.open("POST",url,true);
xmlHttp.onreadystatechange=handleStateChange;
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
xmlHttp.send(carAsJson);
}
function handleStateChange()
{
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
//alert(xmlHttp.responseText);
document.getElementById("selectdata").innerHTML=xmlHttp.responseText;
}
}
}
function People(name,age,sex,loveColor)
{
this.name=name;
this.age=age;
this.sex=sex;
this.loveColor=loveColor;
}
</script>
</head>
<body>
<form action="#">
<table>
<tr>
<td>姓名:</td>
<td>
<input type="text" name="name">
</td>
</tr>
<tr>
<td>年龄:</td>
<td>
<input type="text" name="age">
</td>
</tr>
<tr>
<td>性别:</td>
<td>
<input type="text" name="sex">
</td>
</tr>
<tr>
<td>你喜欢的颜色:</td>
<td>
<input type="text" name="loveColor">
</td>
</tr>
</table>
<input type="button" value="GetData" onclick="doJson();"/>
<br>
<br>
<div id="selectdata"></div>
</form>
</body>
</html>
- Ajax学习笔记(三)
- Ajax学习笔记(三)
- AJAX IN ACTION 学习笔记(三)
- javascript dom 学习笔记(三),ajax
- jQuery学习笔记(三)Ajax
- Ajax实践学习笔记(三) Ajax应用模型
- Ajax基础学习笔记三—jQuery实现Ajax
- AJAX基础教程——学习笔记(三)
- ajax 学习笔记之三 级联的操作
- AJAX 学习笔记[三] get 与post 模式的区别
- Ext JS4学习教程+笔记(三)Ajax请求
- (学习Asp.net Ajax笔记三)客户端调用WebService
- AJAX 学习笔记[三] get 与post 模式的区别
- dhtmlxtree学习笔记三(ajax动态获取数据)
- OWASP WebGoat---安全测试学习笔记(三)---Ajax安全
- AJAX学习笔记(三)——XMLHttpRequest 对象
- Struts学习笔记(三)Ajax +json+JQuery的综合使用
- AJAX学习笔记(三)_XMLHttpRequest向服务器发送请求
- 实用javaScript技术总结(1)屏蔽类
- 轻松玩转CreateRemoteThread (转载
- 加入SOA技术圈测试第一篇:ABAP 编程点滴(不断更新中)
- Oracle将推免费数据库软件
- 060831
- Ajax学习笔记(三)
- 专家书单推荐:C++藏书阁(上) (下)
- 生成缩略图
- 我的使用createremotethread控制excel右键的源程序
- CreateRemoteThread简单应用
- 第一天
- KVM的执行引擎(下) — 指令集
- struts的国际化以及标签
- Csdn Blog模板CSS代码(1):我心飞翔