傻瓜其实我都知道

javaWebAjax

异步加载、客户端和服务器数据交互更新在局部页面的技术、局部刷新

Ajax优点

局部刷新、效率高

用户体验好

Ajax语法

%

pagecontentType="text/html;charset=UTF-8"language="java"%scripttype="text/javascript"src="lib/jquery-3.2.1.min.js"/scripthtmlheadtitle首页/titlescripttype="text/javascript"$(function(){varbtn=$("#btn");btn.click(function(){$.ajax({url:"/test",type:"post",data:"id=1",dataType:"json",success:function(data){varid=$("#id");varname=$("#name");varscore=$("#score");id.val(data.id);name.val(data.name)score.val(data.score)}});});});/script/headbodyh1style="color:aqua"${String}/h1编号inputid="id"type="text"/br/姓名inputid="name"type="text"/br/分数inputid="score"type="text"/br/inputid="btn"type="button"value="点击添加"/body/html

publicclassUser{privateIntegerid;privateStringname;privatedoublescore;publicUser(Integerid,Stringname,doublescore){this.id=id;this.name=name;this.score=score;}}WebServlet("/test")publicclasstestServletextendsHttpServlet{

OverrideprotectedvoiddoPost(HttpServletRequestreq,HttpServletResponseresp)throwsServletException,IOException{resp.setCharacterEncoding("UTF-8");try{TimeUnit.SECONDS.sleep(3);}catch(InterruptedExceptione){e.printStackTrace();}finally{Useruser=newUser(1,"小博",99.99);JSONObjectjsonObject=JSONObject.fromObject(user);resp.getWriter().write(jsonObject.toString());}}}$.ajax({属性})

url:请求的后端服务地址

type:请求方式、默认get

data:请求参数

dataType:服务器返回的数据类型、text/json/html/xml、一般为text/json

success:请求成功的回调函数

error:请求失败的回调函数

转载请注明：http://www.zmax-alibaba.com/qgda/137954.html