jquery.dotdotdot部分没有显示

我正在使用jquery.dotdotdot创建阅读更多/阅读更少链接的文本部分。对于有多个p标签的部分，文本不会显示。不太清楚问题是什么。我已将我的代码放在下面的小提琴中。jquery.dotdotdot部分没有显示

我感谢任何帮助！谢谢！

$(function() { 
    var addLink = $('.securetext'); 
     addLink.append('<span class="readmore trigger-js">&nbsp;<a >Read more</a></span>'); 
     for (i = 0; i < addLink.length; i++) { 
      if ($(addLink[i]).children("p").length > 0) { 
       $(addLink[i]).children("p").last().append('<span class="readless trigger-js">&nbsp;<a >Read less</a></span>'); 
      } else { 
       $(addLink[i]).append('<span class="readless trigger-js">&nbsp;<a >Read less</a></span>'); 
      } 
     } 
     truncateIfNeeded(); // Initialize ellipsis 
    }); 

var truncateIfNeeded = function (jqueryTag) { 
    var $selectionToTruncate = jqueryTag || $('.securetext'); 

    $selectionToTruncate.dotdotdot({ 
     ellipsis: '... ', 
     watch: true, 
     //wrap : 'letter', 
     height: 20 * 3, // max number of lines 
     after: '.readmore', 
     callback: function (isTruncated, orgContent) { 
      var $currentReadMore = $(this).find('.readmore'); 
      var $currentReadLess = $(this).find('.readless'); 

      if (isTruncated) { 
       $(this).addClass('securetext--is-truncated'); 
       $(this).removeClass('securetext--is-not-truncated'); 
      } 
      bindReadMore(); // bind click on "read more" 
     } 
    }); 
};

来源

2015-04-08 sgolemme

您的代码正在工作，是什么问题？ – Satpal

如果你看小提琴你会注意到第二部分，在测试2下，根本不显示。 – sgolemme

嗯，我只是看着跨浏览器，它看起来像是在Safari浏览器，但不是在Chrome，Firefox或IE8。 – sgolemme

的问题是与用于截断算法。

在第一次迭代中，Read More...链接添加在段落后面（恰好恰好是3行）。这意味着截断逻辑被调用。

在第二次迭代中，Read More...被添加到段落中。整个东西然后适合3行，所以它是删除。这显然是一个错误。

描述GitHub上的bug的问题was closed as wontfix。

This pull request提供了部分修复，但在段落之间截断元素时不会显示省略号。（尽管如此，阅读更多的链接将显示出来。）

来源

2015-04-20 06:22:29 Interrobang

jquery.dotdotdot部分没有显示

回答

相关问题