时间戳

首页 > 解决方案 > 为什么引导下拉菜单不打开？

javascript - 为什么引导下拉菜单不打开？

问题描述

我有一个用 Bootstrap 4.3.1 设计的页面，上面有一个下拉菜单，它无法打开。我已经包含了 /bootstrap/4.3.1/css/bootstrap.min.css、/jquery/3.4.0/jquery.min.js 和 /bootstrap/4.3.1/js/bootstrap.bundle.min.js。

当我尝试打开下拉菜单时（即使是来自https://getbootstrap.com/docs/4.3/components/dropdowns/的示例），我只会在控制台中收到以下错误：“InternalError: too much recursion”（在 Firefox 75.0 中） ）。在 Edge 中类似，只是错误的措辞是“SCRIPT28：堆栈空间不足”。

奇怪的第一件事：在几天之前它已经奏效了。我看不到任何东西，我已经改变了，这不再起作用了。

奇怪的事情 2：错误发生在文件 /bootstrap/node_modules/popper.js/dist/esm/popper.js 中，我没有名为 node_modules 的文件夹。

更奇怪的第 3 件事：当我复制页面源文本并将其保存为 html 文件时，一切正常。

我能做些什么？

编辑：控制台说，错误在 popper.js:147:30 当我点击它时，我得到这一行 (if (/(auto|scroll|overlay)/.test(overflow + overflowY + overflowX)) {)在函数 getScrollParent 中，它在 4 行之后被称为递归。

标签： javascripttwitter-bootstrap

解决方案

经过几次尝试，我找到了解决方案。

我用严格的 xhtml 编写我的页面：

<!DOCTYPE html>
<html lang='de-DE' xml:lang='de-DE' xmlns='http://www.w3.org/1999/xhtml'>

为了强制浏览器，用 xml 解释页面严格（所有标签都正确打开和关闭）我在 php 中发送这个标题：

header('Content-Type: application/xml; charset=utf-8');

当我删除此行时，下拉菜单有效。

在我看来，这似乎是 Bootstrap 中的一个错误。有谁知道，我如何同时使用：Bootstrap 和 xhtml（不仅仅是写 xhtml 有效，还有浏览器将其解释为 xml）？可以在某处报告错误，或者有人可以为我执行此操作吗？

编辑：经过更多研究，我发现不同之处在于，节点名称在 html 中为大写，在 xml 中为小写。
https://developer.mozilla.org/en-US/docs/Archive/Web/Writing_JavaScript_for_HTML

可悲的是，bootstrap 的团队不想与 xhtml 兼容。
https://github.com/twbs/bootstrap/issues/29235

我现在为自己在本地编辑了引导文件，以使其正常工作。我希望引导团队将来改变对这个话题的看法。

推荐阅读