javascript - 父级和 iframe 中的 Bootstrap.js 文件

标签 javascript web twitter-bootstrap javascript-framework

我正在使用 Twitter 的 Bootstrap 创建一个 Web 应用程序。该应用程序包含一个页面,该页面在 iframe 中加载同一域的另一个页面。现在我的问题是,如果我在 iframe 中加载的页面也包含 bootstrap.js 文件,它就会开始与应用程序发生冲突。 例如,我的应用程序有一个 Accordion (折叠)http://twitter.github.com/bootstrap/javascript.html#collapse使用数据属性构建。 一旦加载了 bootstrap.js 的页面,折叠事件就会开始被触发两次。所以类似于

<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 内。

有办法解决这个问题还是我做错了什么?

最佳答案

发现了问题..它对于我的应用程序来说非常具体。它的工作方式是 - 有一个包含的 JS 文件来触发“目标”网页内的应用程序。 JS 文件不会删除页面中的所有内容并构建一个 iframe 以将“目标”的内容加载到 iframe 内。现在在这种情况下,我让 BootstrapJS 在 app.js 文件之前运行,这又导致在“父”框架中执行,然后当应用程序加载时,它会重新加载,从而导致冲突(或由于多次包含而导致多个事件) .

关于javascript - 父级和 iframe 中的 Bootstrap.js 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12153598/

相关文章:

javascript - 在元素中保存超时

javascript - 添加非散点图数据以与 OnClick 一起使用

PHP - 似乎无法重定向我的 php 文件以链接到另一个文件夹中的另一个文件

php - 在 Bootstrap 模式中提供 php 图像搜索结果

javascript - jquery-select2 multi 与 ajax 的 JSON 格式

javascript - 查看页面时更改 CSS 代码

javascript - 必需 ||必需的 HTML5 表单

java - 清除 session 的最佳方法

html - 内联 CSS 以创建一行水平图像

html - 如何将登录元素移到 Bootstrap 的第一行