引入JSON的jar包:

注意,如果包不全,页面请求servlet时,jquery ajax会返回error:function

弹出error occured!!!

HTML Code:

 <%@ page language="java" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jquery ajax</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script src="jquery/jquery-1.8.2.min.js" type="text/javascript"></script>
<script language="javascript">
$(function(){
$('.sumbit').click(function(){
var v = $('#account').val();
alert(v);
if($('#account').val().length==){
$('.hint').text("用户名不能位空").css({"background-color":"green"});
}else{
$.ajax({
type:'get',
url:'jqueryAjax',
data:{account:$('#account').val()},
dataType:'json', //很重要!!!.预期服务器返回的数据类型 ,
success:function(data){
$.each(data.jsonArray,function(index){
$.each(data.jsonArray[index],function(key,value){
alert(key+":"+value)
});
}); $('body').append("<div>"+data.account+"</div>").css("color","red");
},
error:function(){
alert("error occured!!!");
} });
}
});
});
</script>
</head> <body>
<h3 align="center">jquery AjaX</h3>
<hr>
<label>请输入你的账户 :</label>
<input id="account" name="account" type="text">
<input class="sumbit" type="button" value="检测">
<div class="hint"></div>
</body>
</html>

dataType:'json', //很重要!!!.预期服务器返回的数据类型 ,这句代码注释掉,也正常运行!

不知是否是servlet中写了这句代码的原因:

response.setContentType("application/x-json");(网上找下原因)

servlet Code:JqueryAjaxServlet.java

 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; import net.sf.json.JSONArray;
import net.sf.json.JSONObject; /**
* Author: YangT
* Version: 1.0
* Create: 2013-3-13 上午10:34:58
*/
public class JqueryAjaxServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
System.out.println("JqueryAjaxServlet : begin"); // response.setContentType("text/html;charset=utf-8");
String account = request.getParameter("account");
System.out.println("account :" + account); JSONObject json = new JSONObject();
JSONArray jsonArray = new JSONArray(); JSONObject member = null;
for (int i = ; i < ; i++) {
member = new JSONObject();
member.put("name", "yangting" + i);
member.put("age", + i);
jsonArray.add(member);
}
json.put("jsonArray", jsonArray);
json.put("account", account); //错误:response.setContentType("text/html;charset=utf-8");
response.setContentType("application/x-json");
PrintWriter pw = response.getWriter();
pw.print(json.toString()); System.out.println("json array :" + jsonArray.toString());
System.out.println("json object :" + json.toString());
System.out.println("JqueryAjaxServlet : end"); pw.close(); } public void doPost(HttpServletRequest request, HttpServletResponse response)
throws IOException, ServletException {
this.doGet(request, response);
} }

web.xml

 <?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5"> <servlet>
<servlet-name>JqueryAjaxServlet</servlet-name>
<servlet-class>JqueryAjaxServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>JqueryAjaxServlet</servlet-name>
<url-pattern>/jqueryAjax</url-pattern>
</servlet-mapping> </web-app>

java servlet+jquery+json学习小例子的更多相关文章

  1. php+jquery+ajax+json简单小例子

    直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...

  2. java操作xml的一个小例子

    最近两天公司事比较多,这两天自己主要跟xml打交道,今天更一下用java操作xml的一个小例子. 原来自己操作xml一直用这个包:xstream-1.4.2.jar.然后用注解的方式,很方便,自己只要 ...

  3. java连接mysql的一个小例子

    想要用java 连接数据库,需要在classpath中加上jdbc的jar包路径 在eclipse中,Project的properties里面的java build path里面添加引用 连接成功的一 ...

  4. Java Servlet生成JSON格式数据并用jQuery显示

    1.Servlet通过json-lib生成JSON格式的数据 import java.io.IOException;import java.io.PrintWriter;import java.uti ...

  5. Django1.7+JQuery+Ajax集成小例子

    Ajax的出现让Web展现了更新的活力,基本所有的语言,都动态支持Ajax与起服务端进行通信,并在页面实现无刷新动态交互. 下面是散仙使用Django+Jquery+Ajax的方式来模拟实现了一个验证 ...

  6. js中的json的小例子

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  7. java入门---简介&简单输出小例子&开发前准备

        Java是由Sun Microsystems公司于1995年5月推出的Java面向对象程序设计语言和Java平台的总称.由James Gosling和同事们共同研发,并在1995年正式推出.J ...

  8. java任务调度quartz框架的小例子

    quartz是一个开源的作业调度框架,当然,java可以使用Timer来实现简单任务调度的功能,但Timer是单线程的设计方案,使得一个任务延迟会影响到其他的任务.java也可以使用Scheduled ...

  9. 收藏的js学习小例子

    1.js模拟java里的Map function Map(){ var obj = {} ; this.put = function(key , value){ obj[key] = value ; ...

随机推荐

  1. CCArray(转)

    http://blog.csdn.net/passtome/article/details/7966451 CCArray也是cocos2d-x自己写的类.它相当于是objc的NSArray.在coc ...

  2. CCSpawn使用CCRepeatForever无效

    在使用CCSpawn中加入CCRepeatForever,但却无法使用CCRepeatForever的效果. CCActionInterval* action =(CCActionInterval*) ...

  3. OD: Shellcode / Exploit & DLL Trampolining

    看到第五章了. 标题中 Dll Tramplining(跳板)名字是从如下地址找到的,写的很好: http://en.wikipedia.org/wiki/Buffer_overflow#The_ju ...

  4. html拼接数据的时候一定要注意null值的问题

    后台会返回null文本  如果直接拼接 不仅仅格式问题 前台会显示null   如果是图片  用fiddle抓取 还会发现你请求了一个带域名/null的接口     所以要把null格式化为空文本

  5. win7 安装 IIS

    和xp不同,xp安装 IIS需要下载额外的软件包. 步骤 1,依次打开 "控制面板" -> "程序" ->"打开或关闭windows功能& ...

  6. C#生成高清缩略图

    /// <SUMMARY> /// 为图片生成缩略图 /// </SUMMARY> /// <PARAM name="phyPath">原图片的 ...

  7. 在MVC中利用uploadify插件实现上传文件的功能

    趁着近段的空闲时间,开发任务不是很重,就一直想把以前在仓促时间里所写的多文件上传功能改一下,在网上找了很多例子,觉得uploadify还可以,就想用它来试试.实现自己想要的功能.根据官网的开发文档,同 ...

  8. 过滤器压缩全站jsp

    过滤器: public class Gzip implements Filter { public void destroy() {} public void doFilter(ServletRequ ...

  9. C++基于模板顺序表的实现(带排序)

    说明:代码是可以运行的,但是发表在博客上后复制到编译器里面报N多错误,找了半天原因是网页里面生成了一些空白字符,这些字符编译器无法识别. 因此使用了2种插入格式插入代码. 第二个带注释解释的代码不可复 ...

  10. js+css:43种常见的浏览器兼容性问题大汇总

    javascript 1.HTML对象获取问题 FireFox:document.getElementById(“idName”); ie:document.idname或者document.getE ...