我正在使用 Twitter Bootstrap，我想使用 Bootstrap 中不可用的“自动建议”，而 jQuery UI 有自己的自动建议方法。
我可以同时使用吗？会不会超载带宽？
【问题讨论】：
标签： jquery-ui twitter-bootstrap
查看jquery-ui-bootstrap。来自自述文件：
Twitter 的 Bootstrap 是我最喜欢的项目之一 2011，但经常使用它让我想要两件事：
与 jQuery UI 并行工作的能力（ 导致许多小部件在视觉上损坏）主题的能力 使用 Bootstrap 样式的 jQuery UI 小部件。虽然我喜欢 jQuery UI，但我 （和其他人一样）发现一些当前的主题看起来有点过时。 我希望这个主题为其他人提供一个不错的选择 那感觉一样。澄清一下，这个项目的目的不是或打算 替换 Twitter 引导程序。它仅仅提供了一个 jQuery UI 兼容的 主题灵感来自 Bootstrap 的设计。它还提供了一个版本 带有一些（次要）部分的 Bootstrap CSS 注释掉了哪些启用 与它一起工作的主题。
【讨论】：
只是为了更新这一点，bootstrap v2 不再与 jquery ui 冲突
https://github.com/twbs/bootstrap/issues/171
编辑：作为@Freshblood，有些事情仍然存在冲突。然而，正如最初发布的那样，Twitter 表明他们正在努力解决这个问题，并且它在很大程度上是有效的，特别是与 v1 相比。
【讨论】：
button() 方法。
为了将来参考（因为这是谷歌的最佳答案 ATM），为了防止 jQuery UI 覆盖引导程序或您的自定义样式，您需要创建自定义下载并选择 no-theme 主题。这将只包括 jQuery UI 的重置，并且不会为各种元素重载 bootstrap 的样式。
虽然我们在这里，但一些 jQuery UI 组件（例如 datepicker）具有本机引导程序实现。原生引导实现将使用引导 css 类、属性和布局，因此应该与框架的其余部分更好地集成。
【讨论】：
在我有限的经验中，我也遇到了问题。似乎可以使用引导 CSS 设置 JQuery 元素（例如按钮）的样式。但是，我在创建 JQuery UI 选项卡并希望将仅引导输入（使用 input-append 类）锁定到每个选项卡的底部时遇到问题，只有第一个正确放置。所以，JQuery 选项卡 + 引导按钮 = 可能不是。
【讨论】：
Bootstrap 仍然不能与 Jquery UI 一起使用，例如 modal.Bootstrap 有很好的风格，但作为一个框架，后面有 Twitter 并不是那么好。
【讨论】：
如果您遇到 javascript 命名空间冲突，您可以使用 Bootstrap 的 noConflict() 函数将其功能让给 jQuery UI。
【讨论】：
虽然这个问题特别提到了 jQuery-UI 自动提示功能，但问题的标题更笼统：bootstrap 3 是否可以与 jQuery UI 一起工作？我在使用 jQUI datepicker（弹出日历）功能时遇到了问题。我解决了 datepicker 问题，希望该解决方案能帮助解决其他 jQUI/BS 问题。
今天我很难让最新的 jQueryUI（1.12.1 版）日期选择器与 bootstrap 3.3.7 一起工作。发生的事情是日历会显示但不会关闭。
原来是 jQUI 和 BS 的版本问题。我用的是最新版的Bootstrap，发现不得不降级到这些版本的jQUI和jQuery：
jQueryUI - 1.9.2 （已测试 - 有效）
jQuery - 1.9.1 或 2.1.4 （经过测试 - 两者都有效。其他版本可能有效，但这些有效。）
Bootstrap 3.3.7 （已测试 - 有效）
因为我想使用自定义主题，所以我还构建了 jQUI 的自定义下载（删除了一些东西，例如所有交互、对话框、进度条和一些我不使用的效果）——并确保选择底部的“Cupertino”作为我的主题。
我是这样安装的：
<head>
...etc...
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/cupertino/jquery-ui-1.9.2.custom.min.css">
<link rel="stylesheet" href="css/bootstrap-3.3.7.min.css">
<!-- <script src="js/jquery-1.9.1.min.js"></script> -->
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/jquery-ui-1.9.2.custom.min.js"></script>
<script src="js/bootstrap-3.3.7.min.js"></script>
...etc...
</head>
对于那些感兴趣的人，CSS 文件夹如下所示：
[css]
- bootstrap-3.3.7.min.css
- font-awesome.min.css
- style.css
- [cupertino]
- jquery-ui-1.9.2.custom.min.css
[images]
- ui-bg_diagonals-thick_90_eeeeee_40x40.png
- ui-bg_glass_100_e4f1fb_1x400.png
- ui-bg_glass_50_3baae3_1x400.png
- ui-bg_glass_80_d7ebf9_1x400.png
- ui-bg_highlight-hard_100_f2f5f7_1x100.png
- etc (8 more files that were in the downloaded jQUI zip file)
【讨论】：
如果不将其存储在本地并使用他们提供的链接，您可能会获得更高的性能。在某些情况下，客户端可能已经缓存了脚本。至于 jQueryUI，我建议在必要时不要加载它。 它们都被最小化了，但是您可以启动控制台并查看网络选项卡，看看它需要多长时间才能加载，一旦最初下载它将被缓存，因此您以后不必担心。我的结论是是的，两者都使用，但使用 CDN
【讨论】：
是的，您可以同时使用两者。来自 twitter 的 js bootstrap 是 jquery 插件的集合。与 jQuery UI 不应该有任何冲突。
关于带宽过载，这实际上取决于您如何处理加载所有 js 文件的请求。如果您真的不想向服务器发出多个请求来请求每个文件，只需将它们附加在一起并最小化。或者你可能可以摆脱一些你不需要的 js 引导插件。它非常模块化。
【讨论】：
!important，我发现自己经常不得不重写和修复，有时使用 hacky 代码。我讨厌 Bootstrap 并且不鼓励使用它，至少在它停止使用不使用 Bootstrap 类的元素之前。 （这不是最初设计者的错——我怀疑 Twitter 的最初开发者是否期望他们正在努力成为一个受欢迎的库。）
Kendo UI 有一个漂亮的bootstrap theme here 和一组可与 jquery-UI 媲美的 Web UI。 他们还有一个 open source version 与主题很好地配合。
【讨论】：
我有使用 jquery ui 开发的网站，我只是尝试插入引导程序以用于未来的开发和样式设置，但它几乎破坏了一切。
所以不，它们不兼容。
【讨论】：
因为这是 google 在 jquery ui 和 bootstrap.js 上的最高结果，我决定将其添加为社区 wiki。
我正在使用：
当我包含 bootstrap.js 时，它会禁用 jquery ui autocomplete 的下拉菜单。
我的三个解决方法：
【讨论】：
data-role="none" 是使它们协同工作的关键。您可以应用到您希望引导程序触摸但 jquery mobile 忽略的元素。 像这样 input type="text" class="form-control" placeholder="Search" data-role="none"
【讨论】：