修复 jQuery UI 和 Bootstrap 工具提示冲突答案

【问题标题】：Fix jQuery UI and Bootstrap tooltip conflict修复 jQuery UI 和 Bootstrap 工具提示冲突
【发布时间】：2016-08-04 13:30:42
【问题描述】：

我正在使用 Bootstrap 设计一个表单。我有一个元素，我已将.sortable 应用于：

$(function() {
  $('#field_wrapper').sortable({
    placeholder: "drop"
  });
$('#field_wrapper').disableSelection();
});

我想对元素应用 Bootstrap 工具提示，但在 jQuery 中发现了一个冲突：

<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

可以同时使用吗？

【问题讨论】：

jQuery 中的冲突是什么意思？你有什么错误吗？这是什么错误？
我的意思是工具提示不起作用...
工具提示代码在哪里？你能用 jsfiddle 做一个小演示吗？
<div class="tooltip-demo"><span data-toggle="tooltip" data-placement="right" data-container = "body" title="Move"><i class = "fa fa-sort"></i></span></div> **jQuery**$('.tooltip-demo').tooltip({ selector: "[data-toggle=tooltip]", container: "body" }) // popover demo $("[data-toggle=popover]") .popover()
让我猜你在jquery之前引用了你的bootstrap.js？

标签： jquery twitter-bootstrap jquery-ui tooltip jquery-ui-tooltip

【解决方案1】：

我最近也遇到过这个问题。我还想加载引导工具提示，而是加载 jquery UI 工具提示。我也搜索了最后一个对我有用的简单解决方案，就是将 jquery-ui.js 放在 bootstrap.js 和 proper.js 的上方

【讨论】：

【解决方案2】：

简单的解决方法是将 Bootstrap 工具提示函数名称（非缩小代码）重命名如下：

/**
 * ------------------------------------------------------------------------
 * Constants
 * ------------------------------------------------------------------------
*/

var NAME$6 = 'tooltip';

将NAME$6更改为唯一名称，例如：

var NAME$6 = 'bsTooltip';

然后引用为$.bsTooltip(options)。

【讨论】：