Question

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

我也使用flotchart jq lib，它需要jQuery Version 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>

我收到了一些错误，但他们没有帮助

Answer 1

您必须在$之后指定var，然后选择器将使用该Jquery版本。例如：

$jQuery_1_11_3('input').val();

Answer 2

一般来说，这听起来不错，如果真的没有其他可能性和解决方案，你只需要同时使用不同版本的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.
-->

使用带插件的多个jQuery版本

2 个答案: