用于按容器宽度/高度截断长文本字符串的 jquery 插件

Question

正如标题所说，我想根据指定容器的宽度和高度截断用户输入的文本字符串。我的规范是截断字符串，在末尾显示一些类似Read More 的消息，当用户点击它时，文本会向下滑动。

更新：啊！忘了一件事。它也应该处理多字节字符。

有人可以说明我有哪些选择吗？ jQuery 插件或一些漂亮的 jquery sn-p？

感谢和问候

Answer 1

jQuery 扩展器插件：

HTML：

<div class="expandable">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
    incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud 
    exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor.
    </p>
    <p>Reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. 
    Excepteur sint occaecat cupidatat non proident, sunt in culpa qui 
    officia deserunt mollit anim id est laborum.
    </p>
    </div>

Javascript：

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.expander.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function() {

  // simple example, using all default options
  $('div.expandable p').expander();

  // *** OR ***

  // override some default options
  $('div.expandable p').expander({
    slicePoint:       80,  // default is 100
    expandText:         '[...]', // default is 'read more...'
    collapseTimer:    5000, // re-collapses after 5 seconds; default is 0, so no re-collapsing
    userCollapseText: '[^]'  // default is '[collapse expanded text]'
  });

});
</script>

来源：

http://plugins.learningjquery.com/expander/index.html

在此处查看演示：

http://plugins.learningjquery.com/expander/demo/index.html

祝你好运问我是否需要澄清！