javascript - 使用带有插件的多个 jQuery 版本

标签 javascript jquery flot

我使用 AdminLTE 模板。这需要 jQuery 版本 3.X

我还使用 fllotchart jq lib,它需要 jQuery 版本 1.11.3

如果我使用$.noConflict(true)函数我可以使用两个不同的jq版本。

但是$只能处理一个jq lib。

如何使用 2 个不同的版本以及引用 $ 的插件

我的页面: 在 <head>部分:

<!-- jQuery 2.1.4 -->
<script src="{{ asset('bower_components/jquery/dist/jquery.min.js') }}"></script>

页面末尾:

<!-- jQuery 1.11.3 -->
<script src="{{ asset('/bower_components/jquery_1.11.3/jquery.js') }}"></script>
<script type="text/javascript">
var jQuery_1_11_3 = $.noConflict(true);

<script src="{{ asset('/bower_components/Flot/jquery.flot.js') }}"></script>
<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="{{ asset('/bower_components/Flot/excanvas.min.js') }}"></script><![endif]-->
<script src="{{ asset('/bower_components/Flot/jquery.flot.time.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.label.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.resize.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.canvas.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.crosshair.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.navigate.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.axislabels.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.stack.js') }}"></script>

我收到一些错误,但它们没有帮助

最佳答案

总的来说,这听起来是一个坏主意,如果真的没有其他可能性和解决方案,您只需要一次使用不同版本的 jQuery。也许,最好停止使用过时的 flot 库。
您可以多次加载 jQuery 并在其后附加需要特定版本的脚本。

只需查看此演示即可:

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
  // jQuery 1 demo
  console.log("I need jQuery 1 and it is actually " + jQuery.fn.jquery);
  console.log("jQuery size() function: " + $("body").size); // exists
</script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.js') }}"></script>
<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="{{ asset('/bower_components/Flot/excanvas.min.js') }}"></script><![endif]-->
<script src="{{ asset('/bower_components/Flot/jquery.flot.time.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.label.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.resize.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.canvas.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.crosshair.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.navigate.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.axislabels.js') }}"></script>
<script src="{{ asset('/bower_components/Flot/jquery.flot.stack.js') }}"></script>
<!-- Other scripts which require jQuery 1 -->

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
  // jQuery 3 demo
  console.log("I need jQuery 3 and it is actually " + jQuery.fn.jquery);
  console.log("jQuery size() function: " + $("body").size); // deprecated and removed
</script>
<!-- Other scripts which require jQuery 3 -->

<!-- 
    Here go your custom scripts which use latest loaded jQuery. 
    Make sure to load the version you use (I hope it is the latest one) 
    in your scripts at last to make sure that jQuery 3 
    is used in all other places by default.
-->

关于javascript - 使用带有插件的多个 jQuery 版本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43886771/

相关文章:

javascript - 从 DOM 中移除的元素取消绑定(bind)事件

javascript - 带 rails 的主干 - 包括订单

javascript - 如何将 JSON 数据添加到 nvd3 图表

javascript - 添加然后在延迟后删除类但没有页面刷新

javascript - 使用 Jquery Ajax 更改按钮数据工具提示文本(从

jquery - 计算项目 jquery 模板

javascript - 在服务器上运行 Flot、Javascript?

jQuery 浮点 : clear graph

javascript - 将 json 插入数组以获取浮点图

javascript - 输入提交按钮在 Android 设备上不起作用