想显示导入文件进度，js实现了一个导入耗费时间的效果，但是想将其封装成面向对象的，可是封装之后没有正常运行，js 面向对象能力不够啊，不知道代码是啥原因，setinterval没有间隔时间运行，只运行了一次，请高手指导一下原因，谢谢啦！
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>新增属性值</title>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
</head>
<body>
<div id="importInfo"></div>
<input type="button" onclick="inportProcesser.Start()" value="开始">
<input type="button" onclick="inportProcesser.Close()" value="结束">
<script>
function Progresser(intervalms, intervalHandle) {
this.intervalMs = intervalms;
this. totalIntervalMs = 0;
this. timer=null;
this.Oninterval = intervalHandle;
}
Progresser.prototype = {
constructor: Progresser,
Start: function () {
//console.log("Start totalIntervalMs：" + this.totalIntervalMs);
this.timer = setInterval( this.IntervalHandle() , this.intervalMs);
//console.log("Start timer：" + this.timer);
},
Close: function () {
//console.log("Close totalIntervalMs：" + this.totalIntervalMs);
if (this.timer != null) {
//console.log("Close timer：clearInterval pre" + this.timer);
clearInterval(this.timer);
//console.log("Close timer：clearInterval next" + this.timer);
}
this.totalIntervalMs = 0;
}
,
IntervalHandle: function () {
this.totalIntervalMs += this.intervalMs ;
//console.log("IntervalHandle totalIntervalMs：" + this.totalIntervalMs);
this.Oninterval(this.totalIntervalMs);
//console.log("IntervalHandle timer：" + this.timer);
}
}
var inportProcesser = new Progresser(500, importing2);
function importing2(totalIntervalMs) {
var second = (totalIntervalMs / 1000.0).toFixed(1);
console.log("seconds:" + second + "s..");
}
</script>
</body>
</html>
3 回答
紫衣仙女
TA贡献1839条经验 获得超15个赞
Start: function () { //console.log("Start totalIntervalMs：" + this.totalIntervalMs); this.timer = setInterval( () => { this.IntervalHandle(); }, this.intervalMs); //console.log("Start timer：" + this.timer); },
这里改成这样就可以了
慕尼黑5688855
TA贡献1848条经验 获得超2个赞
楼上的解答是正确的，但这是ES6的写法，其实你的问题是一个“js闭包”的问题而已。
解决办法可以先声明一个全局变量
步骤一
var this_ = null;
步骤二
Start: function () {
//console.log("Start totalIntervalMs：" + this.totalIntervalMs);
this_ = this;
this.timer = setInterval( this.IntervalHandle , this.intervalMs);
/****************************
说明，问题是你原来是this.IntervalHandle()调用的，但实际上应该是this.IntervalHandle，不需要();
问题又来了，this.IntervalHandle在setInterval里面单独调用的话那么this.IntervalHandle函数的
this指向的就是windos对象了。因为setInterval是全局函数。
***********************************************/
//console.log("Start timer：" + this.timer);
},
步骤三
IntervalHandle: function () {
this_.totalIntervalMs += this_.intervalMs ;
//console.log("IntervalHandle totalIntervalMs：" + this.totalIntervalMs);
this_.Oninterval(this_.totalIntervalMs);
//console.log("IntervalHandle timer：" + this.timer);
}
holdtom
TA贡献1805条经验 获得超10个赞
谢谢，没太看明白，对于闭包一直没理解，js简单的能写，深入的话，尤其是封装的，看着一头雾水啊！
有时间我还是要好好看看那本js高级程序设计，多研究一下开源代码！
添加回答
举报
0/150
提交
取消