IE8 Error: is null or not an object, but can still trace/console log out
IE8 Error: is null or not an object, but can still trace/console log out
我在 IE8 中遇到一个 JS 错误,但我似乎无法找到引发此错误的原因。
我正在引用 JSON 文件,该文件已被 jQuery 的 $.getJSON()
请求和解析。完成后,我使用一个被触发的事件 (pub/sub),然后从那里对已解析的 JSON 文件执行我需要执行的操作。
一切正常,直到 IE8 在 imgPath
变量声明(如下)中抛出错误。我正在通过 src
属性将图像加载到 <img>
标记中。
//This is function is inside a object
IE8_loadImage: function($root, data) {
var self = this,
$comp = $root.data('comp').parent,
$imgHolder = $root.data('comp').IE8holder,
imgPath = $root.data('json')[data.scene][data.convo]['ie8Img'];
console.log(typeof $root.data('json')); //outputs to 'object'
console.log(imgPath); //outputs to 'images/1-0.jpg'
console.log(typeof imgPath); //output 'string'
console.log(typeof data.scene); //output 'string'
console.log(typeof data.convo); //output 'string'
//Set the source
$imgHolder.css('z-index', 5).attr('src', imgPath);
},
奇怪的是我可以 console.log 输出 imgPath
变量并从 JSON 中得到预期的结果。
JSON(在jsonlint.com上检查过)文件如下:
{
"demo": {
"scene1": {
"c0": {
"text": "Lorem ipsum Tempor magna nisi non enim fugiat do dolor dolore esse aliquip irure ullamco cillum dolor reprehenderit eiusmod dolore irure commodo et reprehenderit voluptate dolore Ut in Duis tempor tempor esse et Duis enim.",
"ie8Img": "images/1-0.jpg",
"audio": {
"source": "audio/s1-1.mp3",
"autoplay": "true"
}
},
"c1": {
"text": "Lorem ipsum Tempor magna nisi non enim fugiat do dolor dolore esse aliquip irure ullamco cillum dolor reprehenderit eiusmod dolore irure commodo et reprehenderit voluptate dolore Ut in Duis tempor tempor esse et Duis enim.",
"ie8Img": "images/1-1.jpg",
"audio": {
"source": "",
"autoplay": "false"
}
}
}
}
任何想法,或者只是第二双眼睛来解释为什么会发生这种情况 - 都会很棒!谢谢。
编辑:
错误信息是data(...)[...][...].ie8Img is null or not an object
问题似乎是我使用 scrollTop 动画触发了双重回调:
$('html,body').animate({
scrollTop: $elem.offset().top - offset
}, self.options.speed, function() {
// Callback function here...
callback();
});
因此使用调试器跟踪我的代码,此事件在 IE8 中针对 'html' 和 'body' 触发了两次。因此,我最终使用 .promise()
在动画完成后仅触发一次回调。由于它触发了两次,变量更新得太快了。
我在 IE8 中遇到一个 JS 错误,但我似乎无法找到引发此错误的原因。
我正在引用 JSON 文件,该文件已被 jQuery 的 $.getJSON()
请求和解析。完成后,我使用一个被触发的事件 (pub/sub),然后从那里对已解析的 JSON 文件执行我需要执行的操作。
一切正常,直到 IE8 在 imgPath
变量声明(如下)中抛出错误。我正在通过 src
属性将图像加载到 <img>
标记中。
//This is function is inside a object
IE8_loadImage: function($root, data) {
var self = this,
$comp = $root.data('comp').parent,
$imgHolder = $root.data('comp').IE8holder,
imgPath = $root.data('json')[data.scene][data.convo]['ie8Img'];
console.log(typeof $root.data('json')); //outputs to 'object'
console.log(imgPath); //outputs to 'images/1-0.jpg'
console.log(typeof imgPath); //output 'string'
console.log(typeof data.scene); //output 'string'
console.log(typeof data.convo); //output 'string'
//Set the source
$imgHolder.css('z-index', 5).attr('src', imgPath);
},
奇怪的是我可以 console.log 输出 imgPath
变量并从 JSON 中得到预期的结果。
JSON(在jsonlint.com上检查过)文件如下:
{
"demo": {
"scene1": {
"c0": {
"text": "Lorem ipsum Tempor magna nisi non enim fugiat do dolor dolore esse aliquip irure ullamco cillum dolor reprehenderit eiusmod dolore irure commodo et reprehenderit voluptate dolore Ut in Duis tempor tempor esse et Duis enim.",
"ie8Img": "images/1-0.jpg",
"audio": {
"source": "audio/s1-1.mp3",
"autoplay": "true"
}
},
"c1": {
"text": "Lorem ipsum Tempor magna nisi non enim fugiat do dolor dolore esse aliquip irure ullamco cillum dolor reprehenderit eiusmod dolore irure commodo et reprehenderit voluptate dolore Ut in Duis tempor tempor esse et Duis enim.",
"ie8Img": "images/1-1.jpg",
"audio": {
"source": "",
"autoplay": "false"
}
}
}
}
任何想法,或者只是第二双眼睛来解释为什么会发生这种情况 - 都会很棒!谢谢。
编辑:
错误信息是data(...)[...][...].ie8Img is null or not an object
问题似乎是我使用 scrollTop 动画触发了双重回调:
$('html,body').animate({
scrollTop: $elem.offset().top - offset
}, self.options.speed, function() {
// Callback function here...
callback();
});
因此使用调试器跟踪我的代码,此事件在 IE8 中针对 'html' 和 'body' 触发了两次。因此,我最终使用 .promise()
在动画完成后仅触发一次回调。由于它触发了两次,变量更新得太快了。