欢迎来到代码驿站!

JavaScript代码

当前位置:首页 > 网页前端 > JavaScript代码

layui多iframe页面控制定时器运行的方法

时间:2021-06-07 08:55:47|栏目:JavaScript代码|点击:

我们web页面中有几个页面是有定时器在刷新的,并且查询的内容还不少,给服务器造成了不少压力。这些接口已经尽量优化,能放到缓存的都放到缓存。然后主管又提了一个需求,就是我们使用的是layui多标签iframe框架,当不在某个页面的iframe时不要执行定时器。我觉得这是一个挺不错的提议,而且实现起来也不难。

粗略地考虑有两个思路,一个是点击标签时开启或关闭定时器,一个是定时器执行时判断所在的iframe是否隐藏,如果隐藏则不执行定时器的方法。第一种维护麻烦,难免有错漏的情况,而且和别的iframe有联系,不好。第二种逻辑判断简单,只和定时器所在iframe有关,虽然定时器一直在跑,不过只要里面的逻辑不执行就行,重要的是减少给服务器的压力。

那么怎么判断定时器所在页面是否隐藏呢?

获取iframe所在元素的父元素,判断是否有layui-show类就好了。

function myInterval(func, time){
 console.log("启动定时器",func,time);
  //点击iframe对应的标签则直接执行定时器方法。不过注意,这里我默认只执行最后一个定时器方法,如果有多个定时器请自行更改。
 top.$("li[lay-id='"+$(self.frameElement).attr("src")+"']").unbind('click').click(function(){
 console.log(func,"方法调用");
 func.call();
 });
 return setInterval(function(){
 console.log("myInterval定时器调用");
 if($(self.frameElement.parentElement).hasClass("layui-show")){
      //判断所在的页面是否显示
  console.log(func,"方法调用");
  console.log("定时器间隔"+time);
  func.call();
 }
 }, time);
}
 

上一篇:JavaScript在浏览器标题栏上显示当前日期和时间的方法

栏    目:JavaScript代码

下一篇:AJAX在GB2312的中文编码传输 AJAX特殊字符编码正确方法

本文标题:layui多iframe页面控制定时器运行的方法

本文地址:http://www.codeinn.net/misctech/137323.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有