JavaWeb22(JSON&AJAX快速入门)

笔记:

一、什么是json——对象字符串  满足对象|数组|对象数组的定义

.json

.xml

数据库访问

JSON:一种与开放语言无关的、轻量级的数据存储格式,全称JavaScript  Object Notation,一种数据格式的表中规范,起初来源于JavaScript这门语言,后来随着使用的广泛,几乎每门开放语言都有处理JSON的APL。

优点:易于人的阅读和编写,易于程序解析与生产

JSON样式:首先一个花括号{},整个代表一个对象,同时里面是一种Key-Value的存储形式,它还有不同的数据类型来区分

二、异步与同步

2.1同步

一个人同一时间 只能做一件事件,只有一件事情做完,才能做另一件事情。

2.2异步

一个人事情做了一半,转而去做其他事情,当其他事件做完以后,再回过头做之前未完成的事情。

三、JSON解析的工具

(1)org.json的使用

(2)net.json的使用

(3)json-simple的使用

(4)gson的使用

(5)jackson的使用

(6)fastjson的使用------------------------------------------

四、fastjson的使用

json文本:满足一个对象的定义或者一个数组的定义或者一个对象数组的定义的字符串

//JS中定义一个对象 stu

    var stu = {"name":"admin","sex":"男"};
 
    var str = "{\"name\":\"admin\",\"sex\":\"男\"}";
    jQuery----$.parseJSON();
 
    java
    Student stu = JSON.parseObject(str,Student.class);

常用方法

	
public static final Object parse(String text); // 把JSON文本parse为JSONObject或者JSONArray
 
public static final JSONArray parseArray(String text); // 把JSON文本parse成JSONArray
 
public static final JSONObject parseObject(String text); // 把JSON文本parse成JSONObject
 
 
 
======================================================================
 
public static final <T> T parseObject(String text, Class<T> clazz); // 把JSON文本parse为JavaBean
 
 
public static final <T> List<T> parseArray(String text, Class<T> clazz); //把JSON文本parse成JavaBean集合
 
public static final String toJSONString(Object object); // 将JavaBean序列化为JSON文本
 
 
 
 
public static final String toJSONString(Object object, boolean prettyFormat); // 将JavaBean序列化为带格式的JSON文本
 
 
 
public static final Object toJSON(Object javaObject); // 将JavaBean转换为JSONObject或者JSONArray。

基本使用案例

 
//对象--JSON字符串
Student stu = new Student("张三", "男", 18);
String string = JSON.toJSONString(stu);
System.out.println(string);//{"name":"张三","age":18,"sex":"男"}
 
//字符串----对象
Student student = JSON.parseObject(string, Student.class);
System.out.println(student);
	    
 //集合---》JSON字符串
List<Student> list = new ArrayList<Student>();
list.add(new Student("张三", "男", 19)); 
list.add(new Student("张翼", "男", 22));
list.add(new Student("李四", "女", 33));
String jsonList = JSON.toJSONString(list);
System.out.println(jsonList);//[{"name":"张三","sex":"男","age":19},{"name":"张翼","sex":"男","age":22},{"name":"李四","sex":"女","age":33}]
		
//JSON字符串----》集合
List<Student> parseArray = JSON.parseArray(jsonList, Student.class);
System.out.println(parseArray.size());
 


一、ajax

可以用$.ajax也可以jquery.ajax,因为jQuery就相当于$;

记得要用键值对的方式写

比如:

$.ajax({

       url:"vname.do",                        //路径 请求地址(servlet)

        data:{sname:name},             //"sname"+name+"&spwd"+pwd,请求参数

        type:"post",                        //请求方式

        dataType:"text",                        //预期服务器可能返回的数据类型

        success.function(data){        //成功的回调函数

        //alert(data);                //data是服务器返回的响应

        $("#aa").heml(data);        //给span赋值innerHTMl

        },

        error.function(){                  //失败的回调函数              

           alert("有误");                   //就会响应错误提示

        }

});

其要用,隔开

 也可以用另一个方法:

$.post        它只返回正确的方法,所以不用写error

$.post("vname.do",{sname:name},function(data){

        $.("#aa").html(data);给span赋值 innerHTML        

}."text")

二、JSON的即时自动补全

  $(function(){
    	 //让div隐藏
    	 $("#aa").hide();
    	 //给文本框添加失焦事件
    	 $("#sname").keyup(function(){
    		 //让div显示
    		 $("#aa").show();
    		//获取文本框的值
    		var name=$("#sname").val();
    		//第一种$.ajax()
    		/* $.ajax({
    			url:"vname.do",//请求地址(servlet)
    			data:{sname:name},//"sname="+name+"&spwd="+pwd,请求参数
    			type:"post",//请求方式
    			dataType:"text",//预期服务器可能返回的数据类型
    			success:function(data){//成功的回调函数
    				//alert(data);//data是服务器返回的响应
    			    $("#aa").html(data);//给span赋值 innerHTML
    			},
    			error:function(){//失败的回调函数
    				alert("有误")
    			}
    		}); */
    		//第二种$.post()
    		 $.post("autoFill.do",{sname:name},function(data){
    			//把json格式的对象数组字符串---》js的对象数组
    			//var ss=evel(data);//js
    			var ss=$.parseJSON(data);//jQuery
    			//alert(ss.length);
    		 	var sb="<ul>";
    			//循环遍历
    			$.each(ss,function(i,u){//下标 ,元素
    				sb+="<li onclick=\"myf('"+u.uname+"')\" onmouseout=\"this.className='yy'\" onmouseover=\"this.className='xx'\">"+u.uname+"</li>";
    			})
    			 sb+="</ul>"; 
    			//给div赋值
    			 $("#aa").html(sb);  
    		 })
    	 })
     })
     
     function myf(name){
    	 //给文本框赋值
    	 $("#sname").val(name);
    	 //让div隐藏
    	 $("#aa").slideUp(500);
     }

这里用到了两种方法post和ajax

还用到几个事件:keyup(鼠标弹起事件);  onmouseout(鼠标移开事件);

onmouseover(鼠标移上事件); onclick(点击事件);

在servlet中要用到json 需要导包 

                       (1) fastjson-1.2.47.jar

                       (2)jackson-annotations-2.2.3.jar

                        (3)jackson-core-2.2.3.jar

                        (4)jackson-databind-2.2.3.jar

//将集合解析成字符串

        String str=JSON.toJSONString(ls);

@WebServlet("/autoFill.do")
public class AutoFillServlet extends HttpServlet{
 
	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doPost(req, resp);
	}
	
	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		// TODO Auto-generated method stub
		//设置编码方式
		req.setCharacterEncoding("utf-8");
		resp.setContentType("text/html; charset=UTF-8");
		//获取out
		PrintWriter out =resp.getWriter();
		//接收客户端传递过来的参数
		String name=req.getParameter("sname");
		//调用biz层的模糊查询方法
		//错误示范 模拟数据
		UserDao ud=new UserDao();
		List<User> ls=ud.getall(name);
		//怎么把集合转成字符串----->json格式的字符串
		StringBuffer sb=new StringBuffer() ;
		/*sb.append("[");
		for(User u:ls) {
			sb.append("{");
			sb.append("\"uname\":\""+u.getUname()+"\",");
			sb.append("\"usex\":\""+u.getUsex()+"\",");
			sb.append("\"uage\":"+u.getUage());
			sb.append("}");
		}
		sb.append("]");*/
		
		//将集合解析成字符串
		String str=JSON.toJSONString(ls);
		
		//由于需要局部刷新 不可用转发 重定向 location.href
		//把响应输送到客户端
		out.write(str);
		out.flush();
		out.close();
	}

记住在里不能用到request,这是异步不能用到跳界面 所以用到out

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值