【发布时间】：2015-05-14 19:45:26
【问题描述】：
我有一个使用 Durandal.js 创建的单页应用程序，我正在调试 IE11 和 Durandal 的 app.showMessage(...) 和 app.showDialog(...) 方法的问题。目前该应用程序在 Chrome、FireFox 和 IE 9 和 10 中运行良好，但在 IE11 中我遇到了一个问题，即我的应用程序在尝试通过 app.showDialog(...) 调用对话框时挂起。如果我在进入我的应用程序之前打开开发工具，它就可以正常运行。如果我尝试访问该应用程序，请运行导致app.showDialog 触发的代码，然后打开开发工具并尝试运行相同的代码，我确实可以访问正在发生的错误，但这不是很有帮助。实际错误为SCRIPT5007: Unable to get property 'name' of undefined or null reference，位于File: system.js, Line: 90, Column: 13。 system.js 的那个区域的代码与 Durandal 的 logError 方法相关，如下所示：
var logError = function(error) {
if(error instanceof Error){
throw error;
}
throw new Error(error);
};
错误堆栈显示为包含在所附图像中（位于我的问题的底部）。抱歉，我不得不使用警报来获取完整的错误堆栈，否则记录的版本将被截断。
我还尝试了一些方法，包括确保我的 doctype 在我的 index.html 文件顶部正确贴有 <!DOCTYPE html>，我已将 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 添加到 index.html，并且我还尝试添加我自己的控制台对象通过我在此处找到的以下脚本捕获可能仍存在于应用程序中的任何调试代码：https://stackoverflow.com/a/12307201/4367226
<script type="text/javascript">
// IE9 fix
if(!window.console) {
alert("There isn't a console!");
var console = {
log: function( x ){},
warn: function( x ){},
error: function( err ){
alert( "Error from console object:" );
alert( err );
alert( err.stack );
},
time: function(){},
timeEnd: function(){}
};
}
</script>
我还通过添加确保应用程序具有“缓存破坏器”（与 https://stackoverflow.com/a/25170531/4367226 相关）
$.ajaxSetup({cache:false});
到我的应用程序。
我还尝试从我的模态中删除 fade 类，但没有成功（如此处建议：https://stackoverflow.com/a/25717025/4367226）。
更多详情 - 该应用运行 Durandal 2.0.1、Twitter Bootstrap 2.3.2 和 jQuery 1.10.2。
任何帮助将不胜感激，如果我能帮助澄清任何事情，请告诉我。
更新
经过进一步调查和调试，我已经能够在 bootstrap-modalmanager.js 文件的 init 方法中找到有问题的代码行，并且它与 jQuery 相关（所以我将该标签添加回我的问题）：
init: function (element, options) {
this.$element = $(element);
this.options = $.extend({}, $.fn.modalmanager.defaults, this.$element.data(), typeof options == 'object' && options);
this.stack = [];
this.backdropCount = 0;
if (this.options.resize) {
var resizeTimeout,
that = this;
$(window).on('resize.modal', function(){
resizeTimeout && clearTimeout(resizeTimeout);
resizeTimeout = setTimeout(function(){
for (var i = 0; i < that.stack.length; i++){
that.stack[i].isShown && that.stack[i].layout();
}
}, 10);
});
}
},
在从上方读取this.options = $.extend({}, $.fn.modalmanager.defaults, this.$element.data(), typeof options == 'object' && options); 的行中，this.$element.data() 位似乎正在把事情搞砸。这就是错误的来源，但我不知道为什么它会在打开开发工具的情况下工作，否则会引发错误。
更新 2
继续挖掘后，我发现 jQuery 1.10.2 的 jQuery.fn.extend 函数坏了。该函数将尝试迭代元素的属性和这部分代码：name = attrs[i].name; 将允许代码尝试访问（有时在 IE11 中）null 或 undefined 值的name - 因此出现错误我看到的。该代码已在 jQuery 1.11.3 中修复（它甚至引用了有时 IE11 的 attrs 元素在代码中可能为 null 的事实），但不幸的是升级版本破坏了我的应用程序中的其他内容，所以我替换了 jQuery 1.10 .2 的jQuery.fn.extend 函数与1.11.3 版本的函数同名。
【问题讨论】：
-
你试过InPrivate浏览吗？对我来说，这听起来仍然像是一个缓存问题，当你打开开发工具时，有一个禁用缓存的选项，如果你有这个设置，它可能会解释不同的行为。 InPrivate (Tools/InPrivate Browsing) 应该为您提供一个全新的会话，就像您第一次访问删除缓存问题的页面一样。
-
感谢弗兰克的建议。我还没有尝试使用 InPrivate 浏览，但我只是测试了它并且没有运气。我实际上已经能够使用调试器来追踪有问题的代码行，并且通过将其注释掉，我已经能够按预期使用该应用程序。违规行位于
bootstrap-modalmanager.js的init 方法中，内容如下：this.options = $.extend({}, $.fn.modalmanager.defaults, this.$element.data(), typeof options == 'object' && options);。问题似乎与该代码的this.$element.data()部分有关。 -
在打开开发工具的情况下运行
this.$element.data()的任何原因都可以正常工作，但在没有开发工具的情况下运行会导致错误？这似乎是我的问题的根源，这似乎很奇怪。在这里进行更多调查... -
经过一番谷歌搜索后，似乎 IE11 的 .data() 函数存在许多问题。如果可能，您可能想尝试升级到最新的 jquey，看看是否有帮助。
-
好的，谢谢弗兰克。我已经使用最新版本的 jquery 1.x 代码进行了初步测试，这似乎解决了最初的问题，尽管现在似乎还有其他事情发生，我必须看看。至少更新似乎是一个修复，只要我能在不破坏其他任何东西的情况下升级它:)
标签： javascript jquery twitter-bootstrap bootstrap-modal durandal-2.0