关于堆栈溢出还有其他答案,但是我无法使它们起作用。
我需要使用2个版本的jQuery。这是我的代码:
我链接到第一个版本,然后有此代码:
<script>
var $i = jQuery.noConflict();
</script>
然后,我链接到第二版并获得以下代码:
<script>
var $j = jQuery.noConflict();
</script>
这是我需要在第二版$ j中运行的代码
<script type="text/javascript">
$j.ready(function() {
$j('#slider').layerSlider({
sliderVersion: '6.2.1',
type: 'fullsize',
responsiveUnder: 0,
fullSizeMode: 'hero',
maxRatio: 1,
parallaxScrollReverse: true,
hideUnder: 0,
hideOver: 100000,
skin: 'outline',
showBarTimer: true,
showCircleTimer: false,
thumbnailNavigation: 'disabled',
allowRestartOnResize: true,
skinsPath: 'skins/',
height: 800
});
});
</script>
我在Chrome中检查了该页面,没有显示任何错误,但是它根本不会运行滑块。
最佳答案
这是一次加载(和使用)2个版本的jQuery的一种方法。完全不需要调用.noConflict
。
console.log(jQuery3.fn.jquery);
console.log(jQuery2.fn.jquery);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>var jQuery3 = jQuery;</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script>var jQuery2 = jQuery;</script>
然后使用
jQuery2
运行滑块脚本:$jQuery2.ready(function() {
$jQuery2('#slider').layerSlider({
sliderVersion: '6.2.1',
type: 'fullsize',
responsiveUnder: 0,
fullSizeMode: 'hero',
maxRatio: 1,
parallaxScrollReverse: true,
hideUnder: 0,
hideOver: 100000,
skin: 'outline',
showBarTimer: true,
showCircleTimer: false,
thumbnailNavigation: 'disabled',
allowRestartOnResize: true,
skinsPath: 'skins/',
height: 800
});
});