zoukankan      html  css  js  c++  java
  • Bootstrap轮播获取当前活动的焦点对象

        在项目中使用了Bootstrap的轮播,需求是轮播下方有一个已读按钮,当点击已读按钮时,隐藏掉当前的焦点的轮播内容;

    如图所示:

    image

    所以要获取当前的焦点是哪一条;

    下方代码是在网络上找到的一个方法,但是发现已经没有了.getActiveIndex()方法,需要进行一定的修正;

    $('#myCarousel').on('slide.bs.carousel', function () {
                 var carouselData = $(this).data('bs.carousel');
    
                // var currentIndex = carouselData.getActiveIndex();//当前图片的索引,注意:这并不是下一张图的索引号
              console.dir($(this).data());
                // var items = carouselData.$items;//所有图片的包裹div的数组
            });

    输出$(this).data()

    发现结果

    image

    此处的$active就是我们要拿到的那个焦点对象;

    所以代码优化为:

    $('#myCarousel').on('slide.bs.carousel', function () {
                 var carouselData = $(this).data('bs.carousel').$active; 
            });

    image

    我给每个item加了一个id,方便操作;

    当然我们的需求不一样,拿到这个对象就好说了。剩下的,自己搞定啦~

  • 相关阅读:
    Node.js 回调函数
    算法二、
    一、Perfect Squares 完全平方数
    Never Go Away
    python 内置方法
    web框架详解之tornado 三 url和分页
    web框架详解之tornado 二 cookie
    前端各种插件
    AJAX请求时status返回状态明细表
    LR之-参数化
  • 原文地址:https://www.cnblogs.com/yuanpengchao/p/5938126.html
Copyright © 2011-2022 走看看