原文:
ellipsis: function(value, len, word) {
        //判断value有没有超过指定长度
        if (value && value.length > len) {
            //word的作用就是尽量不让一个完整的单词被部分省略
            if (word) {
                var vs = value.substr(0, len - 2),
                //猜测单词的界限符
                index = Math.max(vs.lastIndexOf(' '), vs.lastIndexOf('.'), vs.lastIndexOf('!'), vs.lastIndexOf('?'));
//保留一个容忍长度len - 15,过短的话,影响表现效果
                if (index !== -1 && index >= (len - 15)) {
                    return vs.substr(0, index) + "...";
                }
            }
            return value.substr(0, len - 3) + "...";
        }
        return value;
    }
 
经修改:
 function ellipsis(val, len, word) {
if (val && val.length > len) {
if (word) {
var vs = val.substr(0, len - 1)
var i = Math.max(vs.lastIndexOf(' '), vs.lastIndexOf('.'), vs.lastIndexOf('!'), vs.lastIndexOf('?'))
if ( i !== -1 && i >= (len-15) ) {
return vs.substr(0, i) + '...'
}
}
return val.substr(0, len) + '...'
}
return val
}

调用方式:

var aa="你是谁?萨达哈撒";
var bb=ellipsis(aa,5);
console.log(bb);

最简单方法:

var str = "just a test hello world";
function processStr(str,n)
{
var l = str.length;
if(l<=n) return str;
return str.slice(0,n)+"...";
}
document.write(processStr(str,14));

支持区别中英文:

<html>
<script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script> <body>
<input type="text" name="username" />
</body>
<script type="text/javascript"> var GetLength = function (str) {
///<summary>获得字符串实际长度,中文2,英文1</summary>
///<param name="str">要获得长度的字符串</param>
var realLength = 0, len = str.length, charCode = -1;
for (var i = 0; i < len; i++) {
charCode = str.charCodeAt(i);
if (charCode >= 0 && charCode <= 128) realLength += 1;
else realLength += 2;
}
return realLength;
}; //js截取字符串,中英文都能用
//如果给定的字符串大于指定长度,截取指定长度返回,否者返回源字符串。
//字符串,长度 /**
* js截取字符串,中英文都能用
* @param str:需要截取的字符串
* @param len: 需要截取的长度
*/
function cutstr(str, len) {
var str_length = 0;
var str_len = 0;
str_cut = new String();
str_len = str.length;
for (var i = 0; i < str_len; i++) {
a = str.charAt(i);
str_length++;
if (escape(a).length > 4) {
//中文字符的长度经编码之后大于4
str_length++;
}
str_cut = str_cut.concat(a);
if (str_length >= len) {
str_cut = str_cut.concat("...");
return str_cut;
}
}
//如果给定字符串小于指定长度,则返回源字符串;
if (str_length < len) {
return str;
}
}
$(function () {
$("input[name=username]").bind('keyup', function () {
if (GetLength($(this).val()) > 10) {
$(this).val(cutstr($(this).val(), 10));
return;
}
});
});
</script>
</html>

Js文本溢出自动添加省略号ellipsis的更多相关文章

  1. #CSS 文本溢出部分显示省略号

    单行结尾溢出: 用text-overflow:ellipsis属性实现,当然还需要加宽度width属来兼容部分浏览. width:300px;overflow: hidden; text-overfl ...

  2. css文本溢出隐藏显示省略号(单行+多行)

    文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法.  一. 单行文本不换行,并将超出文本隐藏 .box-content{     ove ...

  3. css 文本换行 文本溢出隐藏用省略号表示剩下内容

    正常文本的显示 <style> p{ width: 300px; box-shadow: 0 0 10px #ccc; padding: 0 20px; margin: 20px 100p ...

  4. css实现文本过长时自动添加省略号

    1. 效果 2. Html <div id="main_app_content" class="container"> <div class= ...

  5. CSS3自动添加省略号

    text-overflow:ellipsis; white-space:nowrap; overflow:hidden; 不换行,一行显示溢出时,文本自动换行.以前都是js计算的,现在可好. elli ...

  6. css为超过一定宽度的文本内容自动加上省略号

    当在html中某个地方添加文本内容的时候如果内容过长我们会希望他超过一定宽度之后,其余的可以被截断,后面补充为省略号: 实现方式: 1.设置css样式为文本不换行: 2.位包裹文本的标签指定宽度: 3 ...

  7. CSS文本溢出,显示省略号(...)

    方式1:这种方式就是必须要跟width搭配使用,当你使用的display:flex; 的时候可能会影响样式 width: 200px; overflow: hidden; /*超出部分隐藏*/ tex ...

  8. 用python给html里的css及js文件链接自动添加版本号

    传统的给文件链接添加版本号的方法是使用gulp-rev,这里提出的解决方案是使用python来替代gulp-rev. import os import re import uuid import sy ...

  9. css 文本溢出时显示省略号

    .text-ellipsis { width:100px; height:60px; overflow: hidden;//隐藏滚动条 text-overflow:ellipsis; white-sp ...

随机推荐

  1. ALAssets的两种用法

    一: ALAssetsGroupEnumerationResultsBlock resultsBlock = ^(ALAsset *result, NSUInteger index, BOOL *st ...

  2. IOS的变量前加extern和static字段

    IOS的变量前加extern和static字段 前一阵子,做项目的时候到网上找Demo,打开运行的时候发现其中变量前有关键字extern和static,所以我研究了一下子 对于extern来说可以理解 ...

  3. Note_Master-Detail Application(iOS template)_01_YJYAppDelegate.h

    //YJYAppDelegate.h #import <UIKit/UIKit.h> @interface YJYAppDelegate : UIResponder <UIAppli ...

  4. 多动手试试,其实List类型的变量在页面上取到的值可以直接赋值给一个js的Array数组变量

    多动手试试,其实List类型的变量在页面上取到的值可以直接赋值给一个js的Array数组变量,并且数组变量可以直接取到每一个元素var array1 = '<%=yearList =>'; ...

  5. UE正则表达式查找和替换(将【,;】)替换为换行

  6. Java Sudoku游戏

    这几天尝试用Java的swing写图形程序,边学习边摸索写了个简单的数独游戏,在编写的过程中学到了不少关于swing的东西,而且对于图形化程序的编写也有了一点简单的认识: 善其事先利其器,既然写图形化 ...

  7. ++index 与 index++

    摘自:C++标准程序库

  8. All X_数的快速幂

    Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Total Submission( ...

  9. 301、404、200、304、500等HTTP状态,代表什么意思?

    一些常见的状态码为: 200 - 服务器成功返回网页 404 - 请求的网页不存在 503 - 服务器超时 下面提供 HTTP 状态码的完整列表.点击链接可了解详情.您也可以访问 HTTP 状态码上的 ...

  10. 触控(Touch) 、 布局(Layout)

    1 使用触控实现一个简易的画板 1.1 问题 触控(Touch)是一个UITouch类型的对象,当用户触摸了屏幕上的视图时自动被创建,通常使用触控实现绘图.涂鸦.手写等功能.本案例使用触控实现一个简易 ...