引导程序 4 + JQueryUI
Posted
技术标签:
【中文标题】引导程序 4 + JQueryUI【英文标题】：Bootstrap 4 + JQueryUI 【发布时间】：2017-10-16 22:57:47 【问题描述】：我正在开发一个同时使用 Bootstrap 4 和 JQueryUI（即可拖放功能）的应用程序。
到目前为止，它工作得很好，但是现在当我尝试使用 Bootstrap 和 JQuery 来显示模式时，就像这样：
$("#modal1").modal();
我收到一个控制台错误，提示 $(...).modal 不是函数。所以我认为我的 JQuery 加载脚本在错误的位置，但是移动它，比如在 Bootstrap css 和脚本之前，会导致一堆这样的错误：
未捕获的类型错误：$(...).draggable 不是函数
而draggable是一个JQueryUI函数。
我的头部标签看起来没问题还是怎么了？为什么Bootstrap不想和我合作？
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link href="https://fonts.googleapis.com/css?family=Noto+Sans|Ubuntu:700" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
如果我需要提供更多详细信息，请告诉我。谢谢！
【问题讨论】：
相关：***.com/questions/35424053/… 所以 bootstrap4 的目标是 3.1 slim，所以它们的顺序是正确的，但是你也加载了 jquery 1.12 取出 jquery 1.12 导致可拖动不再起作用，但是？似乎 jquery-ui 需要 1.12 加载脚本才能运行。 根据this page jQuery UI 1.12 支持 jQuery 1.7 及更新版本。 所以尝试将 jquery-3.1.1.slim 更改为 jquery-3.1.1.min.js (完整）并删除旧的 jquery 1.12.4。 jquery和jquery-ui的版本号没有关系。 【参考方案1】：你正在加载 jquery 两次删除这个：-
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
【讨论】：
尝试用 jquery 3.2.1 替换顶部的 jquery 的苗条版本，即用<script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script> 替换苗条线
成功了，非常感谢！但是，无论如何我都加载 jquery 两次是否有问题？每当我删除旧的 jquery 加载脚本时，jquery-ui 似乎停止工作。不过，现在，当我更换 3.1.1 时。 3.2.1 分钟的苗条 Jquery，完美运行。
slim 版本不包括 jquery-ui 所需的一切，因为，嗯...它是一个苗条的版本以上是关于引导程序 4 + JQueryUI的主要内容，如果未能解决你的问题，请参考以下文章