总结:
Ajax全称Asynchronous JavaScript and XML,也就是异步的js和XML技术。现在网页中Ajax几乎无所不在,前后端的分离也离不开Ajax的异步通信技术。
Ajax是一种不用刷新整个页面便可与服务器通讯的办法。
在还没有ajax技术之前,Web的传统模型。客户端向服务器发送一个请求,服务器返回整个页面,如此反复
Jquery中的Ajax:
原生的Ajax比较繁琐,Jquery已经为我们封装好了现成的,主要有三种方法:load()、get()/post()、getJSON()三种方法。
Ajax传输数据的方式也分为三种方式:
1)XML:笨重,解析困难,但XML是通用的数据交换格式。
2)HTML:不需要解析可以直接放到文档中,若仅更新一部分区域,但传输的数据不是很方便,且HTML代码需要拼装完成。
3)JSON:小巧,有面向对象的特征,且有很多第三方的jar包可以把Java对象或集合转为JSON字符串。
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>$.ajax()方法</title> </head> <body> <h2>用户登录</h2> <form> <p>登录名:<input type="text" name="name"></p> </form> </body> </html> <script type="text/javascript" src="../js/jquery.js"></script> <script type="text/javascript"> //文本框失去焦点时进行验证 $(':input').blur(function(){ $.ajax({ //请求的服务器资源,必须是字符串 url:'api/demo.php', //客户端的请求类型:GET,POST...,推荐大写 type: 'GET', //将表单控件内容序列化为json格式 data:$('form:first').serializeArray(), //成功回调 success: function(msg,status,xhr) { $('p span').empty() $('p').append($(msg)) } }) }) </script>
点击 "运行实例" 按钮查看在线实例
PHP部分省略.....
手抄代码: