jquery - 使用 jquery.dotdotdot，如何在溢出时截断单个单词？

Question

以下 fiddle 演示了该问题:

http://jsfiddle.net/inconduit/2z6Xa/

这是使用 jquery.dotdotdot 插件用省略号截断文本。

当像 a_really_long_filename_with_no_spaces_at_all.txt 这样的单个单词溢出 div 时，此插件不会截断它。有什么办法可以实现这一点吗？

html:

  <div id="wrapper">this_does_not_truncate_because_there_are_no_spaces</div>
  <br><br>
  <div id="wrapper2">this one has spaces and is truncated properly</div>

​ JavaScript:

 $("#wrapper").dotdotdot({wrap: 'letter'});
 $("#wrapper2").dotdotdot({wrap: 'letter'});

CSS:

#wrapper {
    width: 100px;
    height: 20px;
    border: 1px solid red;
}
#wrapper2 {
    width: 100px;
    height: 20px;
    border: 1px solid red;
}​

Answer 1

你真的需要一个插件来做到这一点吗？您是否尝试过使用 CSS text-overflow:ellipsis ？除了 IE 5.5 或更低版本 或 FF 6 或更低版本等非常旧的浏览器之外，所有浏览器都支持它。

有关文本溢出的更多信息:https://developer.mozilla.org/en-US/docs/CSS/text-overflow

演示页面:http://davidwalsh.name/demo/css-ellipsis.php