package com.iss.servlet;
import org.json.JSONException;
import org.json.JSONObject;
import com.iss.pojo.User;
import com.iss.util.JSONUtil;
public class UserServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
//list 添加对象
List<User> userList = new ArrayList<User>();
User user1 = new User("张三", "男", "18");
User user2 = new User("李四", "男", "19");
User user3 = new User("王五", "男", "20");
userList.add(user1);
userList.add(user2);
userList.add(user3);
PrintWriter out = response.getWriter();
String str = null;
try {
//帐号密码如果匹配则把list 返回给界面
if (request.getParameter("userName").equals("jquery")
&& request.getParameter("password").equals("ajax")) {
str = JSONObject.quote(JSONUtil.toJSONString(userList));
}
out.print(str);
} catch (JSONException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
System.out.println("str "+str);
out.flush();
out.close();
}
}
<body>
帐号 jquery 密码 ajax
<form id="mainform">
<ul>
<li>
帐号
<input type="text" name="userName" />
</li>
<li>
密码
<input type="password" name="password" />
</li>
<li>
<input onclick="login()" type="button" value="登录" />
</li>
</ul>
</form>
查询到的数据
<div id="diva">
</div>
<script type="text/javascript">
function login(){
//获取form的参数
var args =$("#mainform").serialize();
//调用 jquery 的json获取方法
//三个参数分别为 :请求路径 ,请求参数,返回数据的回调函数
$.getJSON("servlet/UserServlet",args,function (data){
if(data!=null){
// 界面返回的是一个json格式字符串 调用JSON.parse()把数据转化为json
// 格式的对象
var jsondata =JSON.parse(data);
parseData(jsondata);
}else{
alert("帐号密码输入有误");
}
})
}
function parseData(data){
var str="";
//遍历json格式数据
for (var key in data){
str =str+" 用户"+data[key].userName+" 年龄"+data[key].age+"<br/>"
alert(str);
}
//把数据添加到div中
$("#diva").html(str);
}
</script>
</body>
UserServlet 记得要导入 工具类 JSONStringObject JSONUtil
jsp 要导入 jquery.js和 json.js
其实这都只是利用json工具类把 字符串 拼装 为 json 格式而已 不懂的可以去看下json格式。
附上工程
分享到:
相关推荐
JQuery_Ajax_AutoComplete_使用JSON数据
jQuery_Ajax_Json全解析等相关文档集合
jquery_ajax_json简单实例jquery_ajax_json简单实例
资源名称:J2EE中JSON Jquery_AJAX应用 中文PDF版内容简介:本文档主要讲述的是J2EE中JSON Jquery_AJAX应用;主要是描述使用JSON JQuery_AJAX实现页面动态加载与页面表单数据的异步保存。首先页面通过调用JQuery_...
AJAX-JSON该源码从实例入手教你如何成为一个javascript高手
jQuery_AJAX网页系统jQuery_AJAX网页系统
jquery_ajax_php_三级联动 jquery_ajax_php_三级联动 jquery_ajax_php_三级联动
jQuery_Ajax_Servlet全解析jQuery_Ajax_Servlet全解析
jQuery_Ajax_全解析,对jQuery_Ajax的全面解析,让你更快速的掌握着两门技术
jquery提供的json插件,提供js对象与json字符串间互相转换
J2EE中JSON+Jquery_AJAX应用分享给大家
jquery——ajax__json,的一些文档,jquery——ajax__json,的一些文档,
该包中包含6个jar包,供jquery和json一起开发ajax程序
快速把握jQuery_Ajax核心技术,成为软件开发达人!
通过jquery ajax 在struts2 action 和 jsp之间传递json
使用_jQuery_简化_Ajax_开发.txt使用_jQuery_简化_Ajax_开发.txt使用_jQuery_简化_Ajax_开发.txt
通过ajax(jquery+json)的方式,从xml读取数据;前端的操作全部是js。最后通过保存按钮,ajax的方式进行数据提交,操作界面友好。
J2EE中JSON+Jquery_AJAX应用(1)
jQuery_Ajax全解析.docx jQuery_Ajax全解析.docx
Jquery_ajax实现搜索