Ajax应用场景
- 异步搜索过滤内容
- 表单异步验证
- 异步加载内容数据
- 低调的处理一些数据逻辑
Ajax主要特点
- 在不刷新当前页面的前提下,与服务器进行异步交互。
- 优化了浏览器与服务器之间的数据传输,减少了不必要的数据往返
- 把部分数据处理转移到客户端,减少了服务器的压力。
实现Ajax基本思路
- 根据需求选择一个JavaScript的类库
- JavaScript部分向服务器端传递数据
- php接收传递的数据,处理数据,返回给JavaScript
- JavaScript接收php的数据,并做相应处理
- 在通讯过程中需要用到Json
需要的知识
- 前端:html css JavaScript jquery json
- 服务器:php apache
- 数据库:Mysql sql
目标:
- 通过实例学习php和JavaScript之间如何进行异步交互
- 理解ajax代码的运行结构和基本原理
- 清晰的布局JavaScript代码
环境:
- php+apache+mysql
- Firefox浏览器+firebug插件+jsonhandler
案例功能:
- 异步添加
- 异步删除
- 异步修改
- 异步查询
实现步骤:
- 创建基本的数据表,数据库权限
- 完成显示功能
- 完成删除数据的功能
- 完成了添加数据的功能
- 完成修改数据的功能
第一步:创建数据表及用户授权
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
grant all privileges on etable.* to 'shaddow'@'localhost' identified by '123456'; DROP DATABASE IF EXISTS etable; create database etable; use etable; create table et_data( id int primary key auto_increment, c_a varchar(30), c_b varchar(30), c_c varchar(30), c_d varchar(30), c_e varchar(30), c_f varchar(30), c_g varchar(30), c_h varchar(30) ); LOCK TABLES `et_data` WRITE; /*!40000 ALTER TABLE `et_data` DISABLE KEYS */; INSERT INTO `et_data` VALUES (12,'my','heart','will','go','on','and','on','forever'),(13,'hello','world','are','you','ok','with','your','skill'),(14,'when','i','was','young','i','listen','to','the radio'),(15,'wait','for','my','faveriate','song','you','like','it'),(17,'你','好','吗?','你','真的','好','嘛','确定?'),(18,'我','很','好','啊','谢谢','你','吧','非常'),(19,'故事','发生','在','1998','年','那时候','我们','都不大'),(20,'php','javascript','c','c++','python','golang','c#','java'); UNLOCK TABLES; |