jquery dotdotdot 插件(添加省略号)不适用于 Bootstrap 轮播

Question

我正在为我的 Rails 4 应用程序使用 Bootstrap 3 轮播。为了截断轮播中较长的字幕，我使用了 jquery dotdotdot 插件，它还在末尾附加了“...”。虽然该插件适用于轮播中的第一张图片，但不适用于后续图片。

这是 jsfiddle: http://jsfiddle.net/michaelvli/GD3JH/9/

为什么 dotdotdot 没有在轮播的所有字幕上执行？我曾尝试在每次轮播滑动时使用轮播事件处理程序来执行插件，但此解决方案不合适，因为在 dotdotdot 有机会执行之前，用户会在短时间内看到完整的标题:

$('.carousel').on('slide.bs.carousel', function () {
    $('.dotdotdot').dotdotdot({});
});

或者，如果有人可以推荐另一种截断多行字幕并在末尾附加“...”的解决方案，那也很棒。

Answer 1

问题是因为它没有显示所有元素，所以它没有在每个元素的末尾应用 ...，隐藏的元素没有激活。为了解决这个问题，我们将所有元素都设为 active item 类，以便显示它们，然后将除第一张幻灯片(或元素 0)以外的所有元素切换到 item。再次隐藏他们。所以我们可以添加这个:

$( ".active.item" ).each(function( index ) {
    if(index != 0){
        $(this).removeClass('active');
    }
});

现在我们有了所有受 dotdotdot 正确影响的元素。

Fiddle Here