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 相关文章推荐
Mozilla 表达式 __noSuchMethod__
Apr 05 Javascript
Enter回车切换输入焦点实现思路与代码兼容各大浏览器
Sep 01 Javascript
判断字符串的长度(优化版)中文占两个字符
Oct 30 Javascript
js实现获取当前时间是本月第几周的方法
Aug 11 Javascript
基于jQuery实现仿百度首页选项卡切换效果
May 29 Javascript
url中的特殊符号有什么含义(推荐)
Jun 17 Javascript
plupload+artdialog实现多平台上传文件
Jul 19 Javascript
Javascript vue.js表格分页,ajax异步加载数据
Oct 24 Javascript
详解如何构建一个Angular6的第三方npm包
Sep 07 Javascript
Vue组件之单向数据流的解决方法
Nov 10 Javascript
傻瓜式vuex语法糖kiss-vuex整理
Dec 21 Javascript
layui 富文本赋值,取值,取纯文本值的实例
Sep 18 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小程序自动提交到自助友情连接
2009/11/24 PHP
解析php函数method_exists()与is_callable()的区别
2013/06/21 PHP
PHP与Java进行通信的实现方法
2013/10/21 PHP
curl实现站外采集的方法和技巧
2014/01/31 PHP
php+ajax无刷新上传图片实例代码
2015/11/17 PHP
php使用QueryList轻松采集js动态渲染页面方法
2018/09/11 PHP
图片按比例缩放函数
2006/06/26 Javascript
你真的了解JavaScript吗?
2007/02/24 Javascript
QQ邮箱的一个文本编辑器代码
2007/03/14 Javascript
select、radio表单回显功能实现避免使用jquery载入赋值
2013/06/08 Javascript
原生javascript实现无间缝滚动示例
2014/01/28 Javascript
用jQuery实现的智能隐藏、滑动效果的返回顶部代码
2014/03/18 Javascript
微信小程序 教程之引用
2016/10/18 Javascript
微信小程序 ES6Promise.all批量上传文件实现代码
2017/04/14 Javascript
Javascript中类式继承和原型式继承的实现方法和区别之处
2017/04/25 Javascript
json的结构与遍历方法实例分析
2017/04/25 Javascript
vue+webpack 打包文件 404 页面空白的解决方法
2018/02/28 Javascript
layui监听下拉选框选中值变化的方法(包含监听普通下拉选框)
2019/09/24 Javascript
js+canvas实现画板功能
2020/09/13 Javascript
详解template标签用法(含vue中的用法总结)
2021/01/12 Vue.js
利用Fn.py库在Python中进行函数式编程
2015/04/22 Python
python实现计算倒数的方法
2015/07/11 Python
Python及Django框架生成二维码的方法分析
2018/01/31 Python
Flask Web开发入门之文件上传(八)
2018/08/17 Python
Python运行不显示DOS窗口的解决方法
2018/10/22 Python
python 输出所有大小写字母的方法
2019/01/02 Python
浅谈在django中使用redirect重定向数据传输的问题
2020/03/13 Python
matplotlib 曲线图 和 折线图 plt.plot()实例
2020/04/17 Python
学生如何注册Pycharm专业版以及pycharm的安装
2020/09/24 Python
html5中监听canvas内部元素点击事件的三种方法
2019/04/28 HTML / CSS
如何进行Linux分区优化
2016/09/13 面试题
大学学习个人的自我评价
2014/02/18 职场文书
个人工作表现评语
2014/04/30 职场文书
甜品店创业计划书
2014/08/14 职场文书
校园广播稿100字
2014/10/06 职场文书
离婚答辩状怎么写
2015/05/22 职场文书