JS中我用到的setInterval

简介: 项目需求是这样的:点击行 每隔一段时间刷新该行下的数据 切换点击行的时候也要刷新对应行的数据。点击上面的行,每隔一段时间刷新竞价先看下这个方法怎么用的: var setTime = window.setInterval(function() {这里放要执行的方法!}, 5000);每次用完这个方法的时候 都应该清除clearInterval(setTime )这两个是成对出现的,clearInterval 函数中的参数是 setInterval函数方法的标识。

项目需求是这样的:
点击行 每隔一段时间刷新该行下的数据 切换点击行的时候也要刷新对应行的数据。

img_b3edff15d6f2412bc0e3f1ce6a34a1e6.png
点击上面的行,每隔一段时间刷新竞价

先看下这个方法怎么用的:
<pre> var setTime = window.setInterval(function() {
这里放要执行的方法!
}, 5000);
每次用完这个方法的时候 都应该清除
clearInterval(setTime )
这两个是成对出现的,clearInterval 函数中的参数是 setInterval函数方法的标识。
</pre>
下面问题来了,怎么能够使我每次换行的时候,刷新的是不同行的数据,并且当我离开这个页面的时候 停止刷新,因为如果不停的刷新,它就会不停的请求 ,浪费资源。
我的处理方式:
首先,要让我换行的时候,刷新对应行的数据,那么必须换行的时候清除上一个setInterval
每次点击行的时候清除这个setInterval
第二点 ,怎么才能让我离开页面的时候也能够清除这个setInterval呢?而且必须是同一个setInterval。解决办法,把这个setInterval的标识赋给session
代码:
<pre>
//子查询 这个地方要做实时查询的
$("body").on("click", ".page-biding-center-management-bidding #J_inandoutprice tr", function() {
$(".page-biding-center-management-bidding [name=price_biding]").attr("status", "1");
if ($.kingdom.getParameter("setTime")) {
clearInterval($.kingdom.getParameter("setTime"));//这里清除
}
status = $(this).data("status");
lotid = $(this).data("lotid");
if (status == "02") {
$(".page-biding-center-management-bidding [name=price_biding]").attr("href", "/index.html#common-page");
$(".page-biding-center-management-bidding [name=price_biding]").attr("data-linkto", "action-centermanagement_actionprice");
}
// change = lotid;
var params = {};
params.lotid = $(this).data("lotid") + "";
if ($(this).data("status") == "02" || $(this).data("status") == "03") {
App.blockUI({
boxed: true,
message: "查询中..."
});
showContent.getactionInfoChidren(params)
var setTime2 = window.setInterval(function() {//这里是刷新任务
App.blockUI({
boxed: true,
message: "查询中..."
});
showContent.getactionInfoChidren(params);
}, 5000);
$.kingdom.setParameter("setTime", setTime2);//这里赋给session
if (showContent.len == "0") {
clearInterval($.kingdom.getParameter("setTime"));
}

            } else {
                App.unblockUI();
                toastr.info("竞价状态为竞价中,已结束才能查询实时报价");
                return;
            }

        })

上面的$.kingdom.setParameter 是我们框架封装的set 和get session
下面是方法
setParameter: function(key, value) {
value = value;
window.sessionStorage.setItem(key, value);
return;
}
getParameter: function(key) {
var value = window.sessionStorage.getItem(key);
if (!value || value == '') {
return '';
}
return value;
}
</pre>
这样一来就好办了,只要在你们单页面项目中 路由跳转的时候清除就行了!

大家周末愉快!!!

目录
相关文章
|
6月前
|
JavaScript 前端开发 开发者
JavaScript中setInterval与setTimeout的异同及使用
【4月更文挑战第22天】JavaScript的`setInterval`和`setTimeout`都用于定时执行任务,但有区别。`setInterval`会按指定间隔反复执行,直到被`clearInterval`停止,可能导致函数堆积;`setTimeout`只执行一次,延迟后执行,适合递归调用来模拟间隔。选择使用时要考虑任务的重复性、执行依赖及可能的性能影响。
|
5月前
|
JavaScript 前端开发 安全
JavaScript基础-定时器:setTimeout, setInterval
【6月更文挑战第13天】JavaScript中的`setTimeout`和`setInterval`是异步编程的关键工具,用于按计划执行代码。`setTimeout`在延迟后执行一次,而`setInterval`则周期性执行。常见问题包括忘记清除定时器导致内存泄漏,递归使用`setTimeout`可能引发无限递归,以及字符串代码执行的安全隐患。解决方法包括使用`clearTimeout`和`clearInterval`,设置递归终止条件,以及优先使用函数表达式。理解定时器的非精确性并采用错误处理策略也是实践中的重要技巧。通过示例展示了如何延迟显示消息和周期性打印计数。
95 2
|
4月前
|
JavaScript 前端开发
vue 模拟随机变速的动态打字特效【支持多行文本】(含css实现闪烁光标,js动态改变setInterval定时器的时间间隔)
vue 模拟随机变速的动态打字特效【支持多行文本】(含css实现闪烁光标,js动态改变setInterval定时器的时间间隔)
93 1
|
6月前
|
JavaScript 前端开发 UED
JavaScript 持续变化:setTimeout 与 setInterval 的巧妙应用
JavaScript 持续变化:setTimeout 与 setInterval 的巧妙应用
58 1
|
6月前
|
JavaScript 前端开发 数据处理
JavaScript 游戏规则:setTimeout和setInterval的对决
JavaScript 游戏规则:setTimeout和setInterval的对决
49 1
|
6月前
|
JavaScript 前端开发
为 setTimeout 或 setInterval 提供一个字符串作为第一个参数(js的问题)
为 setTimeout 或 setInterval 提供一个字符串作为第一个参数(js的问题)
36 0
|
6月前
|
JavaScript 前端开发
JS实现可以控制的定时器,setInterval,clearInterval
JS实现可以控制的定时器,setInterval,clearInterval
47 0
|
6月前
|
前端开发 JavaScript 程序员
(前端面试题)详解 JS 的 setTimeout 和 setInterval 两大定时器
(前端面试题)详解 JS 的 setTimeout 和 setInterval 两大定时器
154 0
|
11月前
|
JavaScript 前端开发
原生JavaScript之dom与setInterval/settimeout结合实现动画
原生JavaScript之dom与setInterval/settimeout结合实现动画
60 1
|
JavaScript 前端开发
js 定时器用法详解——setTimeout()、setInterval()、clearTimeout()、clearInterval()
写在前面: 在js应用中,定时器的作用就是可以设定当到达一个时间来执行一个函数,或者每隔几秒重复执行某段函数。这里面涉及到了三个函数方法:setInterval()、setTimeout()、clearInterval(),本文将围绕这三种函数的用法,来实现定时器的功能,需要的朋友可以过来参考下,喜欢的可以点波赞,或者关注一下本人,希望对大家有所帮助。 定时器的应用需求: 1.设定一个时间,当时间到达的时候执行函数————比如:倒计时跳转页面等等。 2.每隔一段时间重复执行某段函数————比如抢票软件,比如设定500毫秒就重复刷新一次页面等等。 倒计时跳转实现demo:
638 0
js 定时器用法详解——setTimeout()、setInterval()、clearTimeout()、clearInterval()
下一篇
无影云桌面