[JAVASCRIPT] IFRAME VS AJAX 异步提交
在ajax没出来之前,一直是用iframe实现的无刷新请求。
主要的原理是:
使用js创建一个隐藏的iframe
把要提交的表单的target属性指向1中生成的iframe
在请求的页面中回调父页面的方法
这样就实现了一个简单的“异步提交”
看起来和ajax一样的效果,那为什么还要有ajax,我们来比较下:(以下把ajax技术称为XHR,iframe实现的称为iframe)
XHR 和 iframe的区别主要在4个地方:
多线程
从上面说的原理很容易就能看出利用iframe实现的异步请求,其实也还是同步的,也就是说后台在处理这个请求的时候,前台仍然是什么都不能做的;而XHR是真正实现了异步请求,它能发起多个异步请求。
回退键
键盘上上的回退键的主要功能是退回到上一个历史页面。
利用iframe实现的异步请求,按回退键是可以回到上个历史页面的;而XHR不行,因为它根本没有留下任何历史的痕迹。
所以现在大多数的搜索引擎是没有利用ajax实现搜索的。
跨站访问
利用iframe实现的异步请求,请求的地址是可以是本应用外的服务;而XHR只能请求本应用的服务。
注意:只要是不用域名的都会被拒绝访问,无论是子域名访问父域名,还是父域名访问子域名
请求的状态
想要在请求返回的同时得到请求的状态(status),iframe实现的异步请求是做不到的;而XHR可以轻而易举的做到。
所以让我们来总结下到底什么时候该选择哪种异步请求:
iframe实现的异步请求
除了这次的请求,没有其他并发的请求
请求的响应时间很短暂,否则用户体验会很差
跨域的请求
能返回历史页面
XHR实现的异步请求
并发的异步请求
根据准确的请求状态做事件响应
相关文档:
项目中想用ajax,于是在网上扒了n多资料,犯了n多错误,从今天上班到现在一直在处理这个问题,终于还是把它解决了。
当我看到页面的ajax显示后,我兴奋异常,为了记录自己学习的ajax历程,也为了让更多的人少走弯路,特写此一文以记之!
废话不说了,为了更好的理解,我重做了一个小的项目,以加深印象。现在 ......
[注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写,否则会提示你一个错误信息 "引用的元素为空或者不是对象"]
========================================================================
对象属性:
document.title //设置文 ......
JavaScript作用小结:
1 创建脚本块
1: <script language=”JavaScript”>
2: JavaScript code goes here
3: </script>
2 隐藏脚本代码
1: <script language=”JavaScript”>
2: <!--
3: document.write(“ ......
很多人都用过AJAX控件吧,AJAX控件不需要刷新页面就可以到后台去读出数据到客户端.AJAX控件除了有很炫的特效外,其要功能就是不需要刷新整个页面就可以取得用户所需要的数据,我把这一块的的功能封装成一个类,方便日后可以重复使用,代码如下:
//Ajax Request Class Start
functio ......
我在js中定义了一个函数:
function closeCodeList()
{
try
{
showFistIndex = 0;
arrayBmCode = null;
if(document.all("spanCode").style.display=='')
{
var disFlag=1;
}
document.all("spanCode").style.display='none';
try{if(disFlag)oldFieldKey.focus();}catch(ex){}
}
c ......