$(function() {
//控制一行半隐藏
(function ($) {
$.fn.displayPart = function (opts) {
$(this).each(function () {
displayPart($(this), opts);
});
}
function displayPart($el, opts) {
var defaults = {
displayLength: 50 //具体的想要显示的字数
}
this.Settings = $.extend(defaults, opts);
if (this.Settings.displayLength == defaults.displayLength && $el.data("textcount")) {
this.Settings.displayLength = $el.data("textcount");
}
var displayLength = this.Settings.displayLength;
var text = $el.text();
if (!text) return "";
var result = "";
var count = 0;
for (var i = 0; i < displayLength; i++) {
var _char = text.charAt(i);
if (count >= displayLength) break;
if (/[^x00-xff]/.test(_char)) count++; //双字节字符,//[u4e00-u9fa5]中文
result += _char;
count++;
}
if (result.length < text.length) {
result += "...";
}
$el.text(result);
}
})(jQuery);
$("p").displayPart();
//控制一行半隐藏

})

js封装的一行半显示省略号。(字数自由控制)的更多相关文章

  1. js实现多行文本超出一定字数显示省略号功能

    最近项目中遇到了一个关于超出一定字数用省略号显示的问题,其实这种形式很常见,公司简介.产品介绍啊里面都可能会用到,一行文字显示省略号很容易,多行就得想点办法了.在经过查阅.整理之后,我也算是实现了这个 ...

  2. 11、多行文本最后一行显示省略号并截取文本字数(vue)

    1.首先通过css实现多行文本显示省略号: { height: 45px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-li ...

  3. js控制文本显示的字数,超出显示省略号

    在css中我们说了用css控制文本显示几行,超出用省略号,但这个办法是要完全占满一整行的,偏偏就是有UI设计师就不这么干,是不是很想打他,哈哈哈,我不会的时候都这样子在心里骂设计师的,这么久那么爱搞特 ...

  4. js 控制超出字数显示省略号

    //多余显示省略号 function wordlimit(cname, wordlength) { var cname = document.getElementsByClassName(cname) ...

  5. javascript超过容器后显示省略号效果(兼容一行或者多行)

    javascript超过容器后显示省略号效果       在实际的项目中,由于文字内容的长度不确定性和页面布局的固定性,难免会出现文字内容超过div(或其他标签,下同)区域的情况,此时比较好的做法就是 ...

  6. CSS控制文字只显示一行 超出部分显示省略号

         <p style="width: 120px; height: 50px; border: 1px solid blue; white-space: nowrap; over ...

  7. CSS控制文字只显示一行,超出部分显示省略号

    <p style="width: 300px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"&g ...

  8. Div内部的内容超出部分显示省略号(仅仅只有一行内容)

    效果如下:

  9. CSS和JS实现单行、多行文本溢出显示省略号(该js方法有问题不对)

    如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...

随机推荐

  1. hadoop2.6.4【ubuntu】单机环境搭建 系列1

    jdk安装 tar zxvf jdk mv jdk /usr/lib/jvm/java jdk环境变量配置 vim /etc/profile ``` export JAVA_HOME=/usr/lib ...

  2. 【bzoj1044】[HAOI2008]木棍分割 二分+dp

    题目描述 有n根木棍, 第i根木棍的长度为Li,n根木棍依次连结了一起, 总共有n-1个连接处. 现在允许你最多砍断m个连接处, 砍完后n根木棍被分成了很多段,要求满足总长度最大的一段长度最小, 并且 ...

  3. 如何实现自己的Android MVP框架?

    相信熟悉android开发的童鞋对MVP框架应该都不陌生吧,网上很多关于android中实现MVP的文章,大家可以直接搜索学习.这些文章中,MVP的实现思路基本都是把Activity.Fragment ...

  4. Hacking Tools

    Hacking Tools 种各样的黑客工具浩如天上繁星,这也让许多刚刚入门安全技术圈的童鞋感到眼花缭乱,本文整理了常用的安全技术工具,希望能够给你带来帮助.以下大部分工具可以在 GitHub 或 S ...

  5. 关于flink的时间处理不正确的现象复现&原因分析

    跟朋友聊天,说输出的时间不对,之前测试没关注到这个,然后就在processing模式下看了下,发现时间确实不正确 然后就debug,看问题在哪,最终分析出了原因,记录如下:    最下面给出了复现方案 ...

  6. [codeforces] 97B Superset || 平面分治

    原题 给出一个平面的一些点,让你添加点,使得所有点对满足以下三个要求中的一个: 1.在一个水平面上 2.在一个竖直线上 3.以这两个点为对角的矩形内包含有其他点 输出一种可行解 因为只需要可行解,且只 ...

  7. 2017-7-18-每日博客-关于Linux下的通配符.doc

    *:匹配零个或多个字符 ?:匹配任意单个字符 ~:当前用户家目录 ~username:用户家目录 ~+:当前工作目录 ~-:上一个工作目录 [0-9]:匹配任意数字范围 [a-z]:匹配任意小写字母( ...

  8. MATLAB矩阵操作大全

    转载自:http://blog.csdn.net/dengjianqiang2011/article/details/8753807 MATLAB矩阵操作大全 一.矩阵的表示 在MATLAB中创建矩阵 ...

  9. TestNG测试执行顺序

    1.preserve-order属性,之前一直认为preserve-order属性是控制配置方法的执行顺序的,其实不是,preserve-order主要是控制test下节点classes执行顺序的 例 ...

  10. 转:CentOS 6.5 nginx

    CentOS 6.5安装及简单配置Nginx 一.准备事项 (1) 因为nginx需要访问80端口所以请先关闭或者开放防火墙端口,和selinux. 参考命令 关闭防火墙: [root@local ~ ...