当包含在引导模式中时，Jquery Colorbox 冻结 IE答案

【问题标题】：Jquery Colorbox Freezes IE when contained in a Bootstrap Modal当包含在引导模式中时，Jquery Colorbox 冻结 IE
【发布时间】：2014-10-28 14:59:09
【问题描述】：

在 IE 上，我有一个包含在 Bootstrap 模式中的 Colorbox 弹出窗口。每当我打开弹出窗口时，它就会打开，但是 IE 会冻结，我必须停止该过程才能关闭它。它只是完全死了。

我不太确定它为什么会这样，因为这些示例在 IE 上运行良好，只有我的会坏。

这是包含我的颜色框的 div。它包含在引导模式中。

<div class='thumbnails-controls'>
 <a colorbox ng-href='{{baseAssetUrl+userID}}/{{asset.asset_uuid}}' class="preview search-thumbnail" title="{{asset.asset_name}}"><i class="icon-search"></i></a>
 <a ng-click="deleteAsset(asset.asset_id)" href="#" title="delete" class="delete-thumbnail"><i class="icon-trash"></i></a>
</div>

我也在使用 AngularJS，我认为这不会引起问题，是吗？我想可能是CSS，所以我把它注释掉了，但它仍然冻结了IE。与硬编码图像 URL 一样，它仍然冻结。我还尝试在 iFrame 中加载图像，它仍然冻结。我也只是为了尝试一些东西，将 ng-href 更改为仅 href，但它仍然冻结。

它只在 IE 中执行此操作。其他所有浏览器都可以正常工作。我不知道为什么这不起作用。

【问题讨论】：

我刚刚注释掉了 Bootstrap 的导入，它不再冻结。但是，这个项目需要 Bootstrap，所以它们有冲突的原因吗？
colorbox 和 bootstrap javascript 可能会以某种方式相互干扰，或者可能会在 Angular 中触发一些意想不到的事情。我会尝试注释掉附加到颜色框或引导事件的任何侦听器或回调。此外，项目是否需要模态中的模态，或者它们是否可以分开？进一步的帮助需要查看 jsfiddle 或 codepen 中的 javascript。
基本上，客户单击一个按钮并打开其资产库。每个资产缩略图都有一个预览按钮，单击它会打开颜色框模式以显示全尺寸预览。这个功能已经完成了，这只是一个维护任务，所以我真的不想重做预览系统来使用另一个库。

标签： jquery internet-explorer colorbox

【解决方案1】：

这似乎是 Bootstrap 模态和 Colorbox 模态之间的焦点冲突。不管出于什么原因 IE 对此很挑剔，其他浏览器更顺利地克服了冲突。

通过谷歌和几个小时的大约十亿个不同的搜索词组合，我找到了this question，这是大约 2 个引导模式，但它解决了我的问题。

从那个问题对我来说有效的答案是添加

$.fn.modal.Constructor.prototype.enforceFocus = function () {};

在我加载了所有 Javascript 导入之后。在 Chrome、Firefox 和 IE 上进行了测试，它似乎运行良好。

This answer，似乎是一个更好的解决方案，但是，我无法让它正常工作，而只是覆盖默认行为对我有用。

【讨论】：