$(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. GDI+绘制可滚动的窗口

    在winform中绘制图形,可以使用gdi+来完成. 当绘制的图形大于目前窗口大小时,就需要滚动条来帮忙显示. 设置属性:Form.AutoScrollMinSize为要显示内容的大小. privat ...

  2. nginx禁止访问目录中可执行文件

    某些网站系统需要用户上传图片等文件到某些目录下,难免程序有些漏洞,导致用户上传了php.cgi等等可执行的文件,导致网站陷入非常为难的境地. 此时我们可以通过nginx来禁止用户访问这些目录下的可执行 ...

  3. JS正则表达式 简单应用

    知识点: 先生成一个正则规则的对象,使用test()对传入的字符串进行验证,返回布尔类型 代码: <!doctype html><html><head> <m ...

  4. 【bzoj2044】三维导弹拦截 dp+二分图最大匹配

    题目描述 n个物品,第i个位置有ai.bi.ci三种属性.每次可以选出满足$\ a_{p_i}<a_{p_{i+1}}\ ,\ b_{p_i}<b_{p_{i+1}}\ ,\ c_{p_i ...

  5. [AGC011E] Increasing Numbers [数学]

    题面 传送门 思路 首先,我们观察一下上升数的性质 可以发现,它一定可以表示为最多9个全是1的数字的和 那么我们设$N$可以被表示成$k$个上升数的和,同时我们设$p_i=\underbrace{11 ...

  6. 洛谷 P3765 总统选举 解题报告

    P3765 总统选举 题目背景 黑恶势力的反攻计划被小C成功摧毁,黑恶势力只好投降.秋之国的人民解放了,举国欢庆.此时,原秋之国总统因没能守护好国土,申请辞职,并请秋之国人民的大救星小C钦定下一任.作 ...

  7. Uva10635 Prince and Princess

    题目戳这里 这题如果用\(f_{i,j}\)这样dp的话肯定过不了,必须另辟蹊径.题目说了数字不重复.我们先只留下两个数组共有的数字.然后我们处理出这样一个数组\(S\),\(S_i\)表示\(A_i ...

  8. MySQL基本管理和应用

    # yum install mysql-server # /etc/init.d/mysqld startInitializing MySQL database: Installing MySQL s ...

  9. windows 系统下TortoiseGit 的安装

    git 常用的使用工具: Windows 支持下载安装TortoiseGit Mac 下 推荐使用 sourcetree Windows下的 TortoiseGit 安装 1. 进入 小乌龟官网 To ...

  10. 我的代码,写的pagebase。还是留着吧。语义化,与我的云平台一样,只不过云平台是用js写的。这个是webform.下回写mvc吧。核心很简单。

    Ps:记一下用的时候,一不小心我手贱碰到的问题吧:我在页面里面加上了form runat=server,然后所有的html控件就再也找不着了.就是下面的control collection这里,如果加 ...