div显示相应幻灯片上的滑块时的活动状态

Question

嗨我正试图让我的滑块在幻灯片显示时显示其相应的按钮活动状态。因此，如果幻灯片1显示按钮，则应显示其活动状态。如果幻灯片2显示按钮2应显示活动状态。

到目前为止，我有：

<!--Top Level Buttons-->
        <div class="section group">
            <div class="colm span_1_of_4">
                <a class="sliderlinks" id="active" href="maritime.html" data-id="1"><h2>Maritime Security</h2></a>
            </div>
            <div class="colm span_1_of_4">
                <a class="sliderlinks" id="active" href="land.html" data-id="2"><h2>Land Security</h2></a>
            </div>
            <div class="colm span_1_of_4">
                <a class="sliderlinks" id="active" href="aviation.html" data-id="3"><h2>Aviation Security</h2></a>
            </div>
            <div class="colm span_1_of_4">
                <a class="sliderlinks" id="active" href="training.html" data-id="4"><h2>Training</h2></a>
            </div>
        </div>

然后使用以下代码将幻灯片放在它下面：

<!--Slider-->
        <div class="section group">
            <div class="col span_12_of_12">
                <div class="flexslider">
                  <ul class="slides">
                    <li>
                      <img src="images/maritime4.jpg" />
                    </li>
                    <li>
                      <img src="images/land1.jpg" />
                    </li>
                    <li>
                      <img src="images/aviation1.jpg" />
                    </li>
                    <li>
                      <img src="images/training1.jpg" />
                    </li>
                  </ul>
                </div>
            </div>
        </div>

我的脚本看起来像这样：

<!--Slider Jquery-->
            <script type="text/javascript" src="js/jquery.flexslider.js"></script>
            <script>
            $('.flexslider').flexslider({
            animation: "slide",
            controlNav: false,
            after: function (e) {
                var elem = $(e.target);

                // Retrive the data attribute from the current li
                var box = elem.attr('data-id');

                // First unset all of the current boxes from being active
                $('.sliderlinks').removeid('active');

                // Append the data attribute value from the li to a class (one of the li's) and set the
                // class to be active
                $('.sliderlinks'+box).addid('active');
            }
          });
            </script>

我无法弄清楚我做错了什么，我在混乱中，有人可以帮助我：）

提前谢谢

利