上次工作中,在使用 Iframe+FormSubmit进行无刷新提交时,如果后台返回的数据有延迟,或者浏览器对Iframe内容的更改过慢的话,会遇到onload响应在Iframe内容改变之前触发,这也就导致了我不能获得我所需要的数据。

之后的解决方法是使用Jquery的load事件。

但是总希望自己能够解决这个问题,但是没有实际的后台配合测试,也不知道到底解决了没有,所以先放着下面吧:

当前版本:v0.0

注:没有实际测试使用,还不知道问题是否解决!!!

     function load(obj){

         if(document.all){ // 对于IE10- 以下使用readState的值来检测内容是否加载好。
var state = null;
(function check(){ try{
state = obj.contentWindow.document.readyState;
}catch(msg){
state = null;
} if(state == 'complete'){ alert();
return false;
}
window.setTimeout(check,);
})(); }else{ // 对于IE11 Edge CH FF 等浏览器直接绑定onload事件进行判断。 obj.onload=function(){
alert();
} } }

调用代码:

 btn.onclick=function(){
document.forms[].submit(); //表单提交
load(ifr);
}

这次,我通过使用IE自有的onreadystatechange时间结合onload时间一起使用,在配合后台的延迟执行代码,经测试,该版的解决方案,应该可以达到理想的效果:

测试浏览器:

  IE5 : OK

  IE6 : OK

  IE7 - IE11 : OK

  safari 5.1 : OK

  Chrome : OK

Firefox : OK

Opera12.10 (最后一版基于poster内核) : OK

当前版本:v1.0

具体代码:

 function load(obj,fn){

    obj.isOpen = false;
obj.onreadystatechange=function(){
if(this.readyState == 'complete'){
if(!this.isOpen){
this.isOpen = true;
fn && fn();
}
}
};
obj.onload=function(){
if(!this.isOpen){
this.isOpen = true;
fn && fn();
}
}; }

PHP代码:

 <?php
$v = $_REQUEST['v'];
sleep(5);
echo 'success';
?>

调用方式:

load(ifr,function(){alert(ifr.contentWindow.document.body.innerHTML)});

 

兼容各浏览器的iframe - onlaod事件的更多相关文章

  1. 兼容各浏览器的js回车事件

    HTML代码: <input type="text" onkeydown="EnterPress(event)" /> JS代码: function ...

  2. 真正的让iframe自适应高度 兼容多种浏览器随着窗口大小改变

    今天有朋友问到我关于"iframe自适应高度"的问题,原本以为是很简单的问题,没想到折腾了20分钟才搞定.期间遇到几个问题,要么是高度自适应了,但是当窗口改变时会出现滚动条.也就是 ...

  3. JS获取回车事件(兼容各浏览器)

    一.用到onkeydown获取事件动作, 二.用到键盘对应代码keyCode, 三. var event=arguments.callee.caller.arguments[0]||window.ev ...

  4. javascript 兼容各个浏览器的事件

  5. 在javascript中的浏览器兼容问题以及兼容浏览器汇总(默认事件,阻止冒泡,事件监听。。。)以及解决方式详解

    在javascript中常见的浏览器兼容问题,以及解决方式. 在前端工作当中我们遵循这样的原则:渐进增强和优雅降级   渐进增强(progressive enhancement): 针对低版本浏览器进 ...

  6. 仿淘宝头像上传功能(三)——兼容 IE6 浏览器。

    前两篇目录: 仿淘宝头像上传功能(一)——前端篇. 仿淘宝头像上传功能(二)——程序篇. 仿淘宝头像上传功能(三)——兼容 IE6 浏览器 之前的这两篇虽然实现了功能,但不兼容低版本浏览器,而且有些浏 ...

  7. 兼容IE浏览器的placeholder【超不错】

    jQuery EnPlaceholder plug (兼容IE浏览器的placeholder)使用 >>>>>>>>>>>>&g ...

  8. 兼容Firefox和IE的onpropertychange事件oninput

    原文 兼容Firefox和IE的onpropertychange事件oninput onpropertychange能够捕获每次输入值的变化.例如:对象的value值被改变时,onpropertych ...

  9. iframe onload事件触发两次

    标准参考 关于 HTML 4.01 规范中 onload 内在事件说明:http://www.w3.org/TR/html401/interact/scripts.html#adef-onload 关 ...

随机推荐

  1. 【吉光片羽】之 Web API

    1.在asp项目中直接添加apiController,需要新增Global.asax文件.再增加一个webapiConfig,如果需要访问方式为"api/{controller}/{acti ...

  2. C#开源磁盘/内存缓存引擎

    前言 昨天写了个 <基于STSdb和fastJson的磁盘/内存缓存>,大家可以先看看.下午用到业务系统时候,觉得可以改进一下,昨晚想了一个晚上,刚才重新实现一下. 更新 1. 增加了对批 ...

  3. Atitit.架构设计趋势 设计模式 ---微服务架构  soa

    Atitit.架构设计趋势 设计模式 ---微服务架构  soa 什么是微服务架构?1 .微服务与SOA的关系 :微服务架架构师面向服务架构(SOA)的一种特定实现1 微服务与康威定律2 微服务的一些 ...

  4. python学习 变量的操作 与 基本数据类型

    一变量(本文使用python3.5): #变量:是计算机内存中的一块区域,变量可以存储规定范围内的值,变量可以改变#在python中变量是计算机内存中数据的引用 python的变量没有明显的类型,具体 ...

  5. DataGridView的Cell事件的先后触发顺序

    最近正在使用“DataGridView”对一个旧的Vs 2003开发的WINDOWS应用程序进行改造. 发现Vs 2003中的"DataGrid"中的一些事件已经在新的控件Data ...

  6. angularjs的resource实例对象

    angularjs的resource实例对象 我们看看都有啥 而直接使用service对象的时候没有前面这些$

  7. WebService如何根据对方提供的xml生成对象

    最近写接口接到一个需求,就是他们推送数据过来,我们这边来提供服务接口. 对方用的是.NET WebService,已经把所有的对象格式定义好了,可能是为了顾及各个平台的通用性,所以只在文档中提供了xm ...

  8. 12.创建一个Point类,有成员变量x,y,方法getX(),setX(),还有一个构造方 法初始化x和y。创建类主类A来测试它。

    package java1; public class Point { int x; int y; Point(int x,int y) { this.x = x; this.y = y; } pub ...

  9. angularjs之插件ngRoute和ngAnimate

    使用ngRoute和ngAnimate配合使用,可以实现页面切换的效果. 如果有使用过swiper,就知道这个效果是怎么样的. 代码: <!DOCTYPE html> <html l ...

  10. binary 和 varbinary 用法

    数据类型 binary(n) 和 varbinary(n) 用于存储二进制数据,n是指字节数量: binary( n ):长度为 n 字节的固定长度二进制数据,其中 n 是从 1 到 8,000 的值 ...