问题标签 [bootstrap-native]

我对Bootstrap Native中的手风琴有疑问。除了一件事，一切都很好。在扩展其他 .collapsed 手风琴后，该类不会添加到已开发的前者中。我已经尝试了几种方法，但仍然没有。添加collapsed类是addClass（元素，折叠）；只是另一种方式 removeClass ... 在 JS 文件下面：

如您所见，代码并未添加到先前开发的( <a href...).collapsed手风琴中。

好像我无法访问脚本中的 .popover 方法。除非我搞砸了，否则我应该可以从包含的 Bootstrap Native（Jquery-free Bootstrap）文件中访问该方法。?

脚本所做的只是添加链接，理想情况下是在该元素上添加一个弹出框。

这是我的代码：

显现：

背景：（点击图标运行）

content_script.js：

链接到引导本机：

https://github.com/thednp/bootstrap.native

和

http://thednp.github.io/bootstrap.native/

错误：

bootstrap-native 是您下载的 bootstrap native/dist/ 文件夹中的 68kb 文件。我认为这可能是问题所在，因为当我在这个文件中粘贴一个变量时，它可以在内容脚本中访问，但不能在方法中访问。

我对这一切都很陌生，所以也许我为引导程序本地所拥有的文件甚至不是正确的文件。或者我没有正确调用该方法，但这不应该给我这个错误。

好像我无法访问脚本中的 .popover 方法。除非我搞砸了，否则我应该可以从包含的 Bootstrap Native（Jquery-free Bootstrap）文件中访问该方法。?

脚本所做的只是添加链接，理想情况下是在该元素上添加一个弹出框。

这是我的代码：

显现：

背景：（点击图标运行）

content_script.js：

}

链接到引导本机：

https://github.com/thednp/bootstrap.native

和

http://thednp.github.io/bootstrap.native/

错误：

bootstrap-native 是您下载的 bootstrap native/dist/ 文件夹中的 68kb 文件。我认为这可能是问题所在，因为当我在这个文件中粘贴一个变量时，它可以在内容脚本中访问，但不能在方法中访问。

我对这一切都很陌生，所以也许我为引导程序本地所拥有的文件甚至不是正确的文件。或者我没有正确调用该方法，但这不应该给我这个错误。

我正在尝试获取Bootstrap Native在 Rails 5 应用程序中与Turbolinks 5一起使用。当我第一次加载页面时，Bootstrap 下拉菜单工作正常，但导航到另一个页面后，Bootstrap 下拉菜单不再工作。就好像 Bootstrap 的事件侦听器断开连接一样。

我已经看到几个关于 Bootstrap 的 jQuery 实现的问题解决了这个问题，但是，我有兴趣使用Bootstrap Native并从我的 JS 堆栈中消除 jQuery 很感兴趣。

以下是一些细节：

应用程序.js

应用程序布局

bootstrap-native 这是Bootstrap Native 包。

从我的 Javascript 标记中删除'data-turbolinks-eval': 'false'，从而在每个 Turbolink 导航上重新评估应用程序的所有 Javascript，确实解决了 Bootstrap Native 问题，但它会导致 rails-ujs 抛出异常。

关于如何解决这个问题的任何想法？

除了分叉库之外，还有没有办法在下拉setFocus的私有show和hide方法中覆盖/禁用？

我正在使用粘性导航栏上的迷你购物车下拉菜单。添加项目后，我希望打开下拉菜单（效果很好），但焦点会跳转到显示和隐藏页面的顶部。我意识到这是一个功能，而不是一个错误！但是对于这个功能，我想防止发生任何滚动。

我是http://thednp.github.io/bootstrap.native/的忠实粉丝，它是 Bootstrap 的香草 JS 版本。按照他们的文档，我这样做了：

但是，当您单击一个选项卡时，什么也没有发生。当此 HTML 在页面中时，它也会打印Uncaught TypeError: Cannot read property 'parentNode' of null到控制台中。

当我尝试使用 JS 方法时，new Tab()它也表示Tab未定义。

如何解决这个问题？

我想在 Angular 2 应用程序中使用带有 bootstrap-native-v4 的 Bootstrap 4 来展示选项卡。（我通过 angular.json 文件“脚本”值“./node_modules/bootstrap.native/dist/bootstrap-native-v4.min.js”包含 bootstrap-native-v4 - 注意我可以看到 bootstrap-native-v4通过 Chrome 开发者工具查看时包含在源 [scripts.js 文件] 中）

我正在使用 localhost:4200/myfolder 在本地运行我的应用程序，但是对于下面的代码，当我将鼠标悬停在/单击选项卡时，URL 默认为 localhost:4200/#home（而不是 localhost:4200/myfolder#home）， localhost:4200/#profile（而不是 localhost:4200/myfolder#profile）等。

所以会发生什么是页面发回一个不存在的 URL

我尝试在头部设置 BaseURL，但是虽然这解决了 URL 问题，但当我单击选项卡时页面不会刷新内容。我还尝试将每个锚点的 href 设置为 myfolder#home、myfolder#profile 等，尽管这解决了 URL 问题（无回发），但标签内容不会刷新

我真的很想避免使用 JQuery（因此使用 bootstrap-native-v4）-大多数/所有示例似乎都使用 JQuery-我正在尝试通过数据 API（bootstrap-native-v4 范围内的 JS 可以寿）

我希望代码不回发到服务器，并简单地在显示相应选项卡内容的选项卡之间切换

任何人都可以帮忙吗？

由于 Bootstrap-native javascript 不是直接必需的，因为它仅在用户开始与页面交互时才真正需要，我想我可以延迟加载它。（是的，它只有几 KB，但是，如果可能的话，为什么不呢？）

小问题是引导脚本将在 DOMContentLoaded 事件上触发它的初始化函数 initCallback()。我相信这个函数会在 HTML 中查找数据标签并关联适当的事件/触发器。由于它是延迟加载的，因此 DOMContentLoaded 在 bootstrap.js 下载之前触发，因此它缺少此事件并且不会初始化。

我只是 Javascript 的爱好者；而且我似乎无法弄清楚在 fetch() （实际上使用我在网上找到的名为 fetchInject() 的函数）完成脚本下载后如何手动调用此函数。

也许延迟加载引导不是一个好主意；但从长远来看，我想我会弄清楚的；如果我至少让这个工作。

initCallback() 执行，以便引导程序将找到所有 HTML 内联数据挂钩（如下拉菜单和东西）

尝试在由引导程序的导航选项卡分隔的多个表中显示 json 内容。我选择通过 FileReader 上传文件（主要是因为不知道将 json 转换为 js 的任何其他方法）。它最初工作正常（使用硬编码表），但是在我上传带有实际信息的 json （并通过 JS 删除硬编码表）后，选项卡不再切换（信息仍然正确显示，但仅在第一个选项卡上）。

我没有收到控制台错误，我很肯定这是一个 JS 问题，因为如果我将更新的（上传后）html 从 Chrome 复制粘贴到 vscode，它会再次完美运行。上传过程中的某些东西破坏了 Bootstrap 的 JS 或阻止它执行，我不知道它是什么。

示例 json：

我希望它在上传 json 后仍然能够切换选项卡，但它什么也不做。

jsfiddle

我正在使用 Bootstrap-native。

由于我不想使用 Bootstrap jquery 或 reactstrap，因此我正在尝试在 React 中实现 bootstrap native in react，一个纯 JavaScript 版本的 bootstrap。

试过了

并装载

但它不起作用，我在 index.html 中的结束正文标记之前尝试使用 CDN

但是模态和下拉菜单等功能不起作用，我在调试控制台中没有错误。