Jquery readmore函数无法正常工作

Question

代码

 var showChar = 50;
    var ellipsestext = "...";
    var moretext = "Read More";
    var lesstext = "Less";
    $('.more').each(function() {
        var content = $(this).html();

        if (content.length > showChar) {

            var c = content.substr(0, showChar);
            var h = content.substr(showChar - 1 , content.length - showChar);

            var html = c + '<span class="moreelipses">' + ellipsestext + '</span>&nbsp;<span class="morecontent"><span>' + h + '</span>&nbsp;&nbsp;<a href="" class="morelink">' + moretext + '</a></span>';

            $(this).html(html);
        }

    });

对于上面的代码，假设readmore链接如下所示。

"Lorem Ipsum has been the standard dummy text ever since th...[Read more]"

然后当我点击readmore而不是显示像这样的段落

  自从 以来，Lorem Ipsum一直是标准的虚拟文本   16世纪，当一个未知的打印机拿出一个类型的厨房并乱扰它   制作一本样本书。

它显示如下

  自从他以来，Lorem Ipsum一直是标准的虚拟文本   16世纪，当一个未知的打印机拿出一个类型的厨房并乱扰它   制作一本样本书。

的jsfiddle

JSFiddle

Answer 1

var h = content.substr(showChar , content.length - showChar); // 'showChar-1' -->showChar

var html =....</span>&nbsp;<span..... //remove &nbsp;

demo http://jsfiddle.net/52wj8mym/3/

Answer 2

尝试使用showChar代替showChar-1：

var h = content.substr(showChar, content.length - showChar);

Answer 3

Updated jsFiddle Demo

2更改：

在以下语句中，删除第一个 ，因为它正在添加不必要的空格。

var html = c + '<span class="moreelipses">' + ellipsestext + '</span>&nbsp;<span class="morecontent"><span>' + h + '</span>&nbsp;&nbsp;<a href="" class="morelink">' + moretext + '</a></span>';

并且，请在下面的showChar - 1中替换showChar，因为它也会使用较短文本中的最后一个字母。

var h = content.substr(showChar, content.length - showChar);