我试图创建一个简单的选框,只是间隔更改。我只是想在Javascript中理解对象。目前,我收到错误object is not a function
。
var marquee = {
domElement: jQuery( 'span' ),
titles: [ 'First', 'Second', 'Third', 'Fourth' ],
current: '',
next: 0,
_getCurrent: function(){
this.current = this.domElement.text();
},
_setNext: function(){
this.next = this.titles.indexOf( this.current ) + 1;
},
changeHeading: function(){
this._getCurrent();
this._setNext();
this.domElement.text( this.titles[ this.next ] );
}
};
var marqueeInterval = setInterval( marquee.changeHeading, 700 );
任何有关我为什么无法使用此功能的帮助将不胜感激。我是面向对象的Javascript的新手,我只是想了解。谢谢!
答案 0 :(得分:3)
通过将changeHeading
的函数引用传递给setInterval
,您将失去每次调用的上下文。您可以通过添加其他功能(例如
setInterval(function() {
marquee.changeHeading();
}, 700);
或像
一样调用Function.prototype.bind
var marqueeInterval = setInterval( marquee.changeHeading.bind( marquee ), 700 );
答案 1 :(得分:2)
由于您将marquee.changeHeading
作为回调传递给setInterval()方法,因此在调用该方法时,执行上下文将不是marquee
object
您可以使用Function.bind(),如下所示
var marqueeInterval = setInterval( marquee.changeHeading.bind(marquee), 700 );
或自定义回调,它将调用目标方法,如
var marqueeInterval = setInterval( function(){
marquee.changeHeading();
}, 700 );
答案 2 :(得分:0)
由于您使用的是jQuery,运行代码的最简单方法是将最后一行替换为下面一行
var marqueeInterval = window.setInterval($.proxy(marquee.changeHeading, marquee), 700);