Uncaught TypeError: slider.slides.on is not a function

Uncaught TypeError: slider.slides.on is not a function

我在我的 website.I 中使用 flexSlider，我正在使用 Slider 和 Carousel Slider 作为导航。它不工作，它给出错误

"Uncaught TypeError: slider.slides.on is not a function"

在我的browser.I的控制台不知道如何解决这个问题？

这是代码

<html>
<head>
<link rel="stylesheet" href="flexslider.css" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="jquery.flexslider.js"></script>
</head>
<script>
$(window).load(function() {
// The slider being synced must be initialized first
$('#carousel').flexslider({
animation: "slide",
controlNav: false,
animationLoop: false,
slideshow: false,
itemWidth: 210,
itemMargin: 5,
asNavFor: '#slider'
});

$('#slider').flexslider({
animation: "slide",
controlNav: false,
animationLoop: false,
slideshow: false,
sync: "#carousel"
});
});
</script>
<div id="slider" class="flexslider">
<ul class="slides">
<li>
  <img src="back1.jpg" />
</li>
<li>
  <img src="back2.jpg" />
</li>
<li>
  <img src="back3.jpg" />
</li>
<li>
  <img src="back4.jpg" />
</li>
<!-- items mirrored twice, total of 12 -->
</ul>
</div>
<div id="carousel" class="flexslider">
<ul class="slides">
<li>
  <img src="back1.jpg" />
</li>
<li>
  <img src="back2.jpg" />
</li>
<li>
  <img src="back3.jpg" />
</li>
<li>
  <img src="back4.jpg" />
</li>
<!-- items mirrored twice, total of 12 -->
</ul>
</div>
</html>

https://www.drupal.org/node/2401623 => 我 运行 陷入同样的​​错误。事实证明，最新的 Flexslider 库需要 jQuery 1.7+。安装 jQuery 更新模块解决了我的问题。