Ajax提交与传统表单提交的区别说明


Posted in Javascript onFebruary 07, 2014

Ajax提交是通过js来提交请求,请求与响应均由js引擎来处理,页面不会刷新,用户感觉不到实际上浏览器发出了请求。比如说我们希望网页总是显示最新的新闻,而又不想老是去点刷新按钮,我们就可以用Ajax机制来实现。网上的客服软件也是ajax请求的一个比较好的案例。传统的请求页面将实现刷新,因此局限性很大。

1.为什么用AJAX?
使用AJAX,用户对Web的体验会更“敏捷”:数据提交页面不会闪屏;页面局部更新速度快;网络带宽占用低。

2.AJAX开发相较传统模式的简单之处:
传统模式下,表单提交则整个页面重绘,为了维持页面用户对表单的状态改变,要多些不少代码。要在控制器和模板之间传递更多参数以保持页面状态。而AJAX不然,因为页面只是局部更新, 不关心也不会影响页面其他部分的内容。

3.AJAX开发相较传统模式的难度:
需要了解、精通JavaScript,而JavaScript存在调试麻烦、浏览器兼容性等很多障碍。

=================================

有如下几种区别: 
1. Ajax在提交、请求、接收时,都是异步进行的,网页不需要刷新;Form提交则是新建一个页面,哪怕是提交给自己本身的页面,也是需要刷新的;

2. A在提交时,是在后台新建一个请求;F却是放弃本页面,而后再请求;

3. A必须要使用JS来实现,不启用JS的浏览器,无法完成该操作;F却是浏览器的本能,无论是否开启JS,都可以提交表单; 4. A在提交、请求、接收时,整个过程都需要使用程序来对其数据进行处理;F提交时,却是根据你的表单结构自动完成,不需要代码干预。

Javascript 相关文章推荐
JavaScript淡入淡出渐变简单实例
Aug 06 Javascript
jQuery动画效果实现图片无缝连续滚动
Jan 12 Javascript
JavaScript常用本地对象小结
Mar 28 Javascript
jQuery Easyui 验证两次密码输入是否相等
May 13 Javascript
jQuery ajax应用总结
Jun 02 Javascript
jQuery插件FusionCharts绘制2D柱状图和折线图的组合图效果示例【附demo源码】
Apr 10 jQuery
angularjs利用directive实现移动端自定义软键盘的示例
Sep 20 Javascript
vue实现键盘输入支付密码功能
Aug 18 Javascript
Vue中跨域及打包部署到nginx跨域设置方法
Aug 26 Javascript
javascript严格模式详解(含严格模式与非严格模式的区别)
Nov 12 Javascript
JS使用正则表达式实现常用的表单验证功能分析
Apr 30 Javascript
JavaScript eval()函数定义及使用方法详解
Jul 07 Javascript
JQUERY 设置SELECT选中项代码
Feb 07 #Javascript
jquery操作select详解(取值,设置选中)
Feb 07 #Javascript
jquery select 设置默认选中的示例代码
Feb 07 #Javascript
jquery 淡入淡出效果的简单实现
Feb 07 #Javascript
通过遮罩层实现浮层DIV登录的js代码
Feb 07 #Javascript
做好七件事帮你提升jQuery的性能
Feb 06 #Javascript
为开发者准备的10款最好的jQuery日历插件
Feb 04 #Javascript
You might like
PHP+ajax 无刷新删除数据
2010/02/20 PHP
深入PHP curl参数的详解
2013/06/17 PHP
PHP 快速排序算法详解
2014/11/10 PHP
php判断两个浮点数是否相等的方法
2015/03/14 PHP
PHP完全二叉树定义与实现方法示例
2017/10/09 PHP
Laravel获取所有的数据库表及结构的方法
2019/10/10 PHP
PHP的重载使用魔术方法代码实例详解
2021/02/26 PHP
标题过长使用javascript按字节截取字符串
2014/04/24 Javascript
ext前台接收action传过来的json数据示例
2014/06/17 Javascript
jQuery实现Twitter的自动文字补齐特效
2014/11/28 Javascript
基于jQuery实现的QQ表情插件
2015/08/25 Javascript
Javascript中常用的检测方法小结
2016/10/08 Javascript
详解原生js实现offset方法
2017/06/15 Javascript
一种angular的方法级的缓存注解(装饰器)
2018/03/13 Javascript
Vue-路由导航菜单栏的高亮设置方法
2018/03/17 Javascript
js实现点击展开隐藏效果(实例代码)
2018/09/28 Javascript
VUE脚手架的下载和配置步骤详解
2019/04/01 Javascript
vue+iview框架实现左侧动态菜单功能的示例代码
2020/07/23 Javascript
python实现装饰器、描述符
2018/02/28 Python
详解python如何在django中为用户模型添加自定义权限
2018/10/15 Python
python基础梳理(一)(推荐)
2019/04/06 Python
Python利用pandas处理Excel数据的应用详解
2019/06/18 Python
使用批处理脚本自动生成并上传NuGet包(操作方法)
2019/11/19 Python
vue常用指令代码实例总结
2020/03/16 Python
Tensorflow加载Vgg预训练模型操作
2020/05/26 Python
用python给csv里的数据排序的具体代码
2020/07/17 Python
CSS3新增布局之: flex详解
2020/06/18 HTML / CSS
使用HTML5拍照示例代码
2013/08/06 HTML / CSS
泰国折扣酒店预订:Hotels2Thailand
2018/03/20 全球购物
Pandora西班牙官方商店:PandoraShop.es
2020/10/05 全球购物
采购部部门职责
2013/12/15 职场文书
演讲比赛获奖感言
2014/02/02 职场文书
十佳护士获奖感言
2014/02/18 职场文书
小学生运动会报道稿
2014/09/12 职场文书
2016年全国助残日活动总结
2016/04/01 职场文书
openstack中的rpc远程调用的方法
2021/07/09 Python