首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

jQuery-等待两个iframe加载

在jQuery中,等待两个iframe加载完成可以使用jQuery的ajaxStart()和ajaxStop()方法。具体实现方法如下:

  1. 在需要等待的两个iframe中,分别添加一个空的ajaxStart()方法,如下:$(document).ready(function() { // 等待第一个iframe加载完成 $("#iframe1").ajaxStart(function() { console.log("iframe1 loading"); }); // 等待第二个iframe加载完成 $("#iframe2").ajaxStart(function() { console.log("iframe2 loading"); }); });$(document).ready(function() { // 等待第一个iframe加载完成 $("#iframe1").ajaxStop(function() { console.log("iframe1 loaded"); }); // 等待第二个iframe加载完成 $("#iframe2").ajaxStop(function() { console.log("iframe2 loaded"); }); });$(document).ready(function() { // 等待第一个iframe加载完成 $("#iframe1").ajaxStart(function() { console.log("iframe1 loading"); }); // 等待第二个iframe加载完成 $("#iframe2").ajaxStart(function() { console.log("iframe2 loading"); }); // 监听iframe加载完成事件 $("#iframe1").load(function() { console.log("iframe1 loaded"); }); $("#iframe2").load(function() { console.log("iframe2 loaded"); }); });这样就可以在jQuery中等待两个iframe加载完成了。
  2. 在需要等待的两个iframe中,分别添加一个空的ajaxStop()方法,如下:
  3. 在需要等待的两个iframe中,分别添加一个监听iframe加载完成事件的函数,并在函数中输出“iframeXXloaded”,其中“XX”代表iframe的序号,如下:
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

js判断iframe加载是否成功的方法

今天木槿来探讨一下js判断iframe加载是否成功的方法,并且兼容多种浏览器。...由于经常需要动态添加iframe,然后再对添加的iframe进行相关操作,而往往iframe还没添加完呢,后边的代码就已经执行完了,所以有些你写的东西根本没有显示出来。...这时,我们就要考虑是否可以等iframe加载完后再执行后边的操作,当然,各种浏览器早就为我们考虑到啦,看下面:ie浏览器IE的每个elem节点都会拥有一个onreadystatechange事件,这个事件每次在...iframe.readyState == "loaded"){//代码能执行到这里说明已经载入成功完毕了//要清除掉事件iframe.detachEvent( "onreadystatechange",...onload 事件,此事件只要触发就说名内容已经加载完毕。

1.8K20
  • iframe 加载外部资源,显示隐藏loading,onload失效

    在项目中使用iframe加载外部资源,需要在iframe请求外部资源的时候,需要显示一个loading,在加载完成后,将这个loading隐藏掉,刚开始看到W3C中 iframe有一个 onload...事件----该事件在iframe加载资源完成后就会触发,但是这个事件我试了试,发现触发不了,最在https://stackoverflow.com/questions/20572734/load-event-not-firing-when-iframe-is-loaded-in-chrome...找到了有效的方法 解决办法如下: 1 设一个变量,var show_loading...== 'interactive'){ self.show_iframe_loading = false clearInterval(interval) } },...500) 这样在刚开始请求的时候就显示loading,然后启动了计时器,每500ms检测一次,如果iframe内有内容的话,就将loading隐藏了

    2K20

    解决iframe参数过长无法加载问题小记

    项目中用到了iframe,传参的时候使用的src属性,默认采用的get方式,此种方式在参数较长的时候就会报错(404无法找到资源),为了解决这种情况,改为采用post方式提交。...实现方式 增加一个form表单的标签,method设置为post,target设置一个标识,假如target=”target1” 在iframe设置name属性,name需要与target一致...name = “target1” 发送请求时通过发送form submit请求来使用post方式 以下代码用于定义iframe和相关form表单。...id="iframe1" name="target1" src="" frameborder="0"> 以下代码用于定义form表单的提交对应的action方法和参数,这样就以post...var frame1 = document.getElementById('iframe1'); var url1 = "/DataDisplay/ShowRangeDataPage"; $('#form1

    1.8K30

    selenium之等待页面(或者特定元素)加载完成

    文章目录 需求: 1、显示等待(推荐) 2、隐式等待(也不错) 3、time.sleep(一般不推荐) 需求: 有时候,我们使用selenium用来获取一些元素时,需要等待页面将某些元素加载网站才能够获取我们需要的数据...,所以,这时候我们就需要等待页面的功能。...1、显示等待(推荐) 显式等待是你在代码中定义等待一定条件发生后再进一步执行你的代码。 最糟糕的案例是使用time.sleep(),它将条件设置为等待一个确切的时间段。...(也不错) 如果某些元素不是立即可用的,隐式等待是告诉WebDriver去等待一定的时间后去查找元素。...默认等待时间是0秒,一旦设置该值,隐式等待是设置该WebDriver的实例的生命周期。

    5.2K20

    【Flutter 16】图解 ListView 异步加载数据与 Loading 等待

    和尚前两天再学 ListView 时,整理了一下在列表中展示多种不同 item 样式,今天继续深入学习异步请求数据并加载新闻列表以及初始进入页面的 loading 等小知识点。...暂时还没有学习下拉刷新与上划加载更多。 ? 一....异步请求数据 async + wait 和尚在前一篇关于网络请求小博客中整理过基本的异步使用方法;和尚在学习中发现有两个小地方需要注意一下: 使用 StatefulWidget 时,一定一定不要忘记...EdgeInsets.fromLTRB(0.0, 35.0, 0.0, 0.0), child: new Center( child: new Text('正在加载中...四. loading 提醒 和尚在加载数据之后发现,网络状况不佳或数据量大时都应有 loading 提醒,尽量给用户一个良好的体验。

    3.6K31

    EasyNVR通过iframe分享视频播放出现加载异常,如何处理?

    TSINGSEE青犀视频开发的视频平台EasyNVR给大家提供丰富的二次开发接口,也可以便捷地做集成,其中在调用地址方面的运用情况比较多,比如调用iframe地址做集成。...有的项目中EasyNVR通过iframe地址分享视频播放页面,视频加载异常,显示如下: image.png 在实际开发中由于网络不环境不稳定导致设备经常出现中断,所以播放器出现加载视频异常的情况,我们在...image.png 开发者可以根据实际情况来处理这类加载失败的异常。...image.png 上面代码是我们实际出现异常情况,我们销毁并重新创建播放器达到视频播放异常时自动加载视频,避免出现异常视频无法重连的bug。

    67240

    复刻MIUI传输数据时的等待图标#有趣的加载icon-2

    上一集,我们使用HTML+CSS复刻了MIUI的加载时的icon,如果想看上一集,请点此跳转。本集来复刻一下MIUI另外一个数据传输icon,如果你有更好的想法,一起在评论区玩耍吧!...一、原效果 [小米运动迁移数据界面] 找了半天也忘了这个加载动画哪里容易截图了,后来在小米穿戴中迁移小米运动数据找到了,嘿嘿,题外话:新版小米穿戴比小米运动好看多了。...写文章时发现电脑管家——个人中心页面也是同样的加载图标(如下图) [腾讯电脑管家个人中心加载icon] 二、实现效果 [实现效果] 偷懒啦,没录视频,截张图好了,如果您需要跑的话,复制源码到本地创建html...六、有趣的加载icon系列 这个系列是我突发奇想弄出来的,主要是通过HTML+CSS来做一些加载动画的icon,这期为第二期,将会不定时加更。...第一期(MIUI加载icon复刻)传送门:https://cloud.tencent.com/developer/article/1869962

    65030

    Android自定义View开源:一款小众、优雅的加载等待控件

    前言 Android开发中,加载等待的需求 非常常见 本文将带来 一款 可爱 & 小资风格的加载等待Android自定义View控件的使用,希望你们会喜欢。...应用场景 App 长时间加载等待时,用于提示用户进度 & 缓解用户情绪 3....特点 对比市面上的加载等待自定义控件,该控件Kawaii_LoadingView 的特点是: 3.1 样式清新 对比市面上 各种酷炫、眼花缭乱的加载等待自定义控件,该款 Kawaii_LoadingView...源码解析 具体请看文章Android:你也可以自己写一个可爱 & 小资风格的加载等待自定义View 7....总结 相信你一定会喜欢上 这款可爱、清新 & 小资风格的加载等待自定义控件 已在Github上开源:Kawaii_LoadingView,欢迎 Star !

    39820
    领券