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

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了layui多iframe页面控制定时器运行的方法，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1384字，纯文字阅读大概需要2分钟。

内容图文

我们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);
}
 

以上这篇layui多iframe页面控制定时器运行的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

内容总结

以上是互联网集市为您收集整理的layui多iframe页面控制定时器运行的方法全部内容，希望文章能够帮你解决layui多iframe页面控制定时器运行的方法所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

---