美文网首页我爱编程
文本超出部分省略显示

文本超出部分省略显示

作者: i_木木木木木 | 来源:发表于2018-05-14 11:32 被阅读17次

    文本超出部分省略显示:

    例:

    方法一:使用CSS溢出省略的方式解决,解决效果如下:

        css代码:

    white-space:nowrap;

    word-wrap:break-word;

    overflow:hidden;

    text-overflow:ellipsis;

    方法二:使用jQuery截取替换文本内容的方式解决解决效果如下:

        js代码:

      $(".text").each(function() {

        if ($(this).text().length > 20){//要求字数大于20才进行字数替换

                  $(this).html($(this).text().replace(/\s+/g, "").substr(0, 80) + "...")//从0到80开始替换,将剩余文本内容替换为"..."

              }

      })

    相关文章

      网友评论

        本文标题:文本超出部分省略显示

        本文链接:https://www.haomeiwen.com/subject/jvpddftx.html