父文件和iframe中的Bootstrap.js文件
我正在使用twitter的bootstrap创建一个web应用程序。该应用程序包含一个页面，该页面在iframe中加载相同域的另一个页面。现在我的问题是，如果我在iframe中加载的页面也包含bootstrap.js文件，它就会开始与应用程序发生冲突。例如，我的应用程序有一个使用数据属性构建的折叠(折叠) http://twitter.github.com/bootstrap/javascript.html#collapse。一旦加载了包含bootstrap.js的页面，折叠事件就开始触发twice.So，如下所示
<head>//Bootstrap css and js files included</head>
<body>
<div>
//Collapsible Menu #1
</div>
<iframe>
<head>
//BootStrap.js script from same location as parent
</head>
<body>
// Another Collapsible Menu #2
</body>
` </head>
</iframe>
</body>在这里，当我尝试点击菜单#1时，Bootstrap.js的代码被触发了两次，结果是显示菜单，然后隐藏菜单。但我的问题并不仅限于菜单。我需要能够在我的应用程序中使用bootstrap.js，也允许已经包含bootstrap.js的页面在iframe中加载。
有没有办法绕过这个问题，还是我做错了什么？
回答 2
Stack Overflow用户
发布于 2014-05-07 12:49:38
找到问题了..这对于我的应用来说是非常具体的。它的工作方式是-在“目标”网页中有一个包含的JS文件来触发应用程序。JS文件不会从页面中删除所有内容，并构建一个iframe来将“目标”的内容加载到iframe中。现在在本例中，我在app.js文件之前运行了BootstrapJS，这反过来导致在“父”框架中执行，然后当应用程序加载时，它会重新加载，从而导致冲突(或由于多个包含而导致的多个事件)。
Stack Overflow用户
发布于 2012-12-14 18:42:26
我只在IE9中遇到了同样的问题。
我正在IFRAME对话框中打开我的网站的一个实例。这意味着有两个Bootstrap实例，如上所述。
当我用鼠标移出IFRAME时，它调整了底层布局的大小，以匹配IFRAME中较小的布局的宽度。
为了解决这个问题，我不得不使用javascript禁用打开页面的bootstrap-responsive.js样式表。然后，您可以在关闭IFRAME对话框时将其重新打开。
if(navigator.userAgent.indexOf("Trident/5")>-1){
window.parent.document.getElementById("responsiveCSS").sheet.disabled = true;
}可怕的黑客攻击，我知道。
https://stackoverflow.com/questions/12153598
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号