Ajax

需要jQuery就导入需要VUE就导入两个都需要就自己实现生态三部曲1. 编写对应处理的Controller返回消息后者字符串或者JSON格式的数据2. 编写Ajax1 url: Controller请求2data: 键值对3 success 回调函数3.给Ajax绑定事件如点击事件click 失去焦点事件 onblur 键盘相关keydown keyup% page contentTypetext/html;charsetUTF-8 languagejava % html head titleAjax /title %-- jQUERY 需要自行导入 导入时注意路径问题--% script src${pageContext.request.contextPath}/js/jquery.min.js/ /head body h2Hello World!/h2 %-- onblur失去焦点--% 用户名input typetext idtxtName onblura1() /body script typetext/javascript function a1(){ // 参数 /* url: 待载入页面的url地址 json data 待发送的key/ value参数 封装了服务器返回的数据 success: 载入成功时候回调的函数 */ $.ajax({ // ajax默认是get请求 url:${pageContext.request.contextPath}/user/quick, data:{username:$(#txtName).val()}, success:function (data){ console.log(data); console.log(status); } }); //使用post的话这么写 /* $.post({ // ajax默认是get请求 url:${pageContext.request.contextPath}/user/quick, data:{name:$(txtName).val()}, success:function (data){ console.log(data); console.log(status); } }); */ // 将文本输出的值 $(txtName).val(); } $(function (){ $.post(${pageContext.request.contextPath}/ajax/a2,function (data){ console.log(data); let html ; for (let i0;idata.length;i) { html tr td data[i].name /td td data[i].age /td td data[i].sex /td tr } $(#content).html(html); }) }) }) /script /html