显示更多/更少,而无需在JavaScript/jQuery中删除Html标记

Roc*_*ngh 1 javascript php c# asp.net jquery

我想实现readmore/less功能.即我将拥有HTML内容,我将从该内容中显示前几个字符,并且会在其前面显示更多链接.我目前正在使用此代码:

    var txtToHide= input.substring(length);
    var textToShow= input.substring(0, length);
    var html = textToShow+ '<span class="readmore">&nbsp;&hellip;&nbsp;</span>' 
+ ('<span class="readmore">' + txtToHide+ '</span>');
    html = html + '<a id="read-more" title="More" href="#">More</a>';
Run Code Online (Sandbox Code Playgroud)

上面的输入是输入字符串,长度是最初显示的字符串的长度.这段代码有一个问题,假如我想从这个字符串中删除20个字符: "Hello <a href='#'>test</a> output",html标签介于两者之间,如果将其部分剥离,它会弄乱页面.我想要的是,如果html标签落在范围之间,它应该覆盖整个标签,即我需要输出"Hello <a href='#'>test</a>".我怎样才能做到这一点

eHu*_*ain 6

而不是手动做太多,我更喜欢你使用以下jQuery插件.

http://plugins.learningjquery.com/expander/index.html#getting-started

它将扩展和折叠您的文本以阅读更多选项,还为您提供了很多自定义.

希望这会有所帮助.

谢谢!

侯赛因