阅读全文阅读全文jQuery插件与HTML失败

我使用此代码为了仅显示文本的第一个500个字符（并且仅在完整的单词之后切出），但是显然在它发现某些HTML代码时失败“500”门槛。阅读全文阅读全文jQuery插件与HTML失败

在这种情况下，它只是添加“...”，然后继续文本（并显示“See More”链接）。

如：

Lorem <strong>impsum dolor</strong> sit amet. Etcétera.

比方说，这应该削减 “impsum” 和 “悲” 之间的文本。其结果是：

Lorem <strong>impsum...<span class="hidden" style="display:none;">dolor</span></strong> sit amet. Etcétera. <a href="#">See More</a>

它应该是：

Lorem <strong>impsum... <span class="hidden" style="display:none;">dolor</strong> sit amet. Etcétera</span><a href="#">See More</a>

或...

Lorem <strong>impsum dolor</strong>... <span class="hidden" style="display:none;">sit amet. Etcétera</span<a href="#">See More</a>

任何方式将是确定的，我只是想削减后的文本。有没有什么办法解决这一问题？

代码：

(function ($) { 
$.fn.readmore = function (settings) { 

$('.home_excerpt').removeClass('home_excerpt'); 

var opts = $.extend({}, $.fn.readmore.defaults, settings); 

this.each(function() { 
    $(this).data("opts", opts); 
    if ($(this).html().length > opts.substr_len) { 
    abridge($(this)); 
    linkage($(this)); 
    } 
}); 

function linkage(elem) { 
    elem.append(elem.data("opts").more_link); 
    $(".text_seemore").click(function() { 
    $(this).hide(); 
    $(this).siblings("span:not(.hidden)").hide().siblings("span.hidden").show(); 
    return false; 
    }); 
} 

function abridge(elem) { 
    var opts = elem.data("opts"); 
    var txt = elem.html(); 
    var len = opts.substr_len; 
    var dots = "<span>" + opts.ellipses + "</span>"; 
    var charAtLen = txt.substr(len, 1); 
    while (len < txt.length && !/\s/.test(charAtLen)) { 
     len++; 
     charAtLen = txt.substr(len, 1); 
    } 
    var shown = txt.substring(0, len) + dots; 
    var hidden = '<span class="hidden" style="display:none;">' + txt.substring(len, txt.length) + '</span>'; 
    elem.html(shown + hidden); 
} 

return this; 
}; 

    $.fn.readmore.defaults = { 
substr_len: 500, 
ellipses: '&#8230;', 
more_link: '<br /><a href="#" class="text_seemore">See&nbsp;More</a>' 
}; 

})(jQuery);

来源

2011-09-01 Santiago