jquery - How to fix "Uncaught TypeError: Failed to set the 'currentTime' property on 'HTMLMediaElement' -

i working cuepoint.js create text links cue html5 video time marker corresponding particular lines of text. need dynamically assign links time value written array string. know need use parseint() recast values integers when retrieved array. since links , times dynamic, need assign links times within loop pushed array. here's code

    var cuetimes = [];     (var j = 0; j < textitems.length; j++) {         var times = parseint(timeitems[j]);         cuetimes.push(times);         $(".field-name-field-text-"+(j+1)+" > div > div").click(function(){ cuepoint.settime(cuetimes[j])});     console.log(cuetimes[j]);     } 

when run code, however, receive error.

uncaught typeerror: failed set 'currenttime' property on 'htmlmediaelement': provided double value non-finite.

as far can tell, integer isn't being correctly read such jquery. however, when output time values console, appear integers. when test code using static array index (for example setting cuetimes[0]), code runs , works expected.

any suggestions on how fix/work around appreciated.

thanks!

here line cuepoint.js file prompts error:

cuepoint.prototype.settime = function(time) {         this.time = time;         this.video.currenttime = time;         return this.video.play();     }; 

cuepoint.js code:

(function() { /* cuepoint coffee. simple library html5 video subtitles , cuepoints */  /**  * @class utils  */  var cuepoint, utils, utils; utils = (function() {     function utils() {}     utils.prototype.log = function(args) {         this.args = args;         if (window.console) {             return console.log(array.prototype.slice.call(this, arguments));         }     };     return utils; })();  /**  * @class cuepoint  */  cuepoint = (function() {     function cuepoint() {         this.nativekeys = object.keys;     }     cuepoint.prototype.init = function(slides) {         var key, value, _results;         this.slides = slides;         this.subtitles = document.getelementbyid("subtitles");         this.video = document.getelementbyid("video");         _results = [];         (key in slides) {             value = slides[key];             this.addslide(key, value);             _results.push(this.events.call);         }         return _results;     };     cuepoint.prototype.events = function() {};     cuepoint.prototype.currenttime = function() {         return this.video.currenttime;     };     cuepoint.prototype.update = function(html) {         this.html = html;         return this.subtitles.innerhtml = this.html;     };     cuepoint.prototype.settime = function(time) {         this.time = time;         this.video.currenttime = time;         return this.video.play();     };     cuepoint.prototype.addslide = function(time, html) {         var self;         this.time = time;         this.html = html;         self = this;         return this.video.addeventlistener("timeupdate", function() {             if (this.currenttime >= time && this.currenttime <= time + 0.3) {                 return self.update(html);             }         },         false);     };     cuepoint.prototype.play = function() {         return this.video.play();     };     cuepoint.prototype.pause = function() {         if (!this.video.paused) {             return this.video.pause();         }     };     return cuepoint; })(); utils = new utils; window.cuepoint = new cuepoint; 

}).call(this);

i figured out. closure of click() function causing value of iterator variable lost within function. solved creating self-executing function access variable locally, explained here:

this code gets done:

for(var j = 0; j< textitems.length; j++){             (function(k){             text[k] = parseint(timeitems[k]);             $(".field-name-field-text-"+(k+1)+" > div > div").click(function(){ cuepoint.settime(text[k])});         })(j);           }