JS实现含有中文字符串的友好截取功能分析


Posted in Javascript onMarch 13, 2017

本文实例讲述了JS实现含有中文字符串的友好截取功能。分享给大家供大家参考,具体如下:

在显示字符串的时候,避免字符串过长往往会对字符串进行截取操作,通常会用到js 的 substr 或者 substring方法, 以及 字符串的length属性

对于非中文的字符串处理是很简单的,但是中文字符的 length  属性值 是1  而不是 2 ,所以处理就不是很友好了。

例如  你有一个字符串  1234567890   和  一二三四五六七八九零,

你只想显示五位长度,往往会这样操作  str = str.substr(0, 5);

但是 12345  与 一二三四五 所占的宽度是不同的,因为中文往往占2字节, 为了显示效果更好,

故封装下面的js, 他会辨别中文字符的 length 为2

$.String.Substr = function (str, n) {//字符串截取 包含对中文处理
  if (str.replace(/[\u4e00-\u9fa5]/g, "**").length <= n) {
    return str;
  }
  else {
    var len = 0;
    var tmpStr = "";
    for (var i = 0; i < str.length; i++) {//遍历字符串
      if (/[\u4e00-\u9fa5]/.test(str[i])) {//中文 长度为两字节
        len += 2;
      }
      else {
        len += 1;
      }
      if (len > n) {
        break;
      }
      else {
        tmpStr += str[i];
      }
    }
    return tmpStr + " ...";
  }
};

PS:这里再为大家推荐2款在线字符统计工具,都包含对中英文及符号的计算功能,相信对大家有一定参考借鉴价值:

在线字数统计工具:
http://tools.3water.com/code/zishutongji

在线字符统计与编辑工具:
http://tools.3water.com/code/char_tongji

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Lazy Load 延迟加载图片的jQuery插件中文使用文档
Oct 18 Javascript
实现点击列表弹出列表索引的两种方式
Mar 08 Javascript
js获得网页背景色和字体色的方法
Mar 21 Javascript
JavaScript中的关联数组问题
Mar 04 Javascript
整理JavaScript对DOM中各种类型的元素的常用操作
May 05 Javascript
基于vue-cli vue-router搭建底部导航栏移动前端项目
Feb 28 Javascript
JS简单判断是否在微信浏览器打开的方法示例
Jan 08 Javascript
使用 webpack 插件自动生成 vue 路由文件的方法
Aug 20 Javascript
原生js基于canvas实现一个简单的前端截图工具代码实例
Sep 10 Javascript
JS实现音乐钢琴特效
Jan 06 Javascript
JavaScript的垃圾回收机制与内存管理
Aug 06 Javascript
原生js实现点击按钮复制内容到剪切板
Nov 19 Javascript
JS实现直接运行html代码的方法
Mar 13 #Javascript
js从输入框读取内容,比较两个数字的大小方法
Mar 13 #Javascript
jsonp跨域请求实现示例
Mar 13 #Javascript
使用openSpeDiv方法实现Ecshop登录弹窗框效果
Mar 13 #Javascript
H5实现中奖记录逐行滚动切换效果
Mar 13 #Javascript
jQuery实现页面倒计时并刷新效果
Mar 13 #Javascript
JS实现的简单拖拽功能示例
Mar 13 #Javascript
You might like
Apache设置虚拟WEB
2006/10/09 PHP
PHP中ob_start函数的使用说明
2013/11/11 PHP
PHP添加Xdebug扩展的方法
2014/02/12 PHP
php实现文件编码批量转换
2014/03/10 PHP
Yii2实现上下联动下拉框功能的方法
2016/08/10 PHP
PHP长连接实现与使用方法详解
2018/02/11 PHP
jQuery jqgrid 对含特殊字符json 数据的 Java 处理方法
2011/01/01 Javascript
JS正则表达式大全(整理详细且实用)
2013/11/14 Javascript
JS获取各种浏览器窗口大小的方法
2014/01/14 Javascript
js,jquery滚动/跳转页面到指定位置的实现思路
2014/06/03 Javascript
JavaScript获取鼠标移动时的坐标(兼容IE8、chome谷歌、Firefox)
2014/09/13 Javascript
JavaScript实现简单的四则运算计算器完整实例
2017/04/28 Javascript
nodejs对express中next函数的一些理解
2017/09/08 NodeJs
微信小程序实现流程进度的图样式功能
2018/01/16 Javascript
手把手教你用Node.js爬虫爬取网站数据的方法
2018/07/05 Javascript
JavaScript监听键盘事件代码实现
2020/06/03 Javascript
如何利用Node.js与JSON搭建简单的动态服务器
2020/06/16 Javascript
python3正则提取字符串里的中文实例
2019/01/31 Python
Python使用os.listdir()和os.walk()获取文件路径与文件下所有目录的方法
2019/04/01 Python
django模型类中,null=True,blank=True用法说明
2020/07/09 Python
工作失误检讨书范文大全
2014/01/13 职场文书
学校安全工作制度
2014/01/19 职场文书
教师档案管理制度
2014/01/23 职场文书
机电一体化求职信
2014/03/10 职场文书
经济职业学院毕业生自荐书
2014/03/17 职场文书
股份转让协议书
2014/04/12 职场文书
企业年度评优方案
2014/06/02 职场文书
旅游文化节策划方案
2014/06/06 职场文书
临床医学生职业规划书范文
2014/10/25 职场文书
2014年社区党建工作总结
2014/11/11 职场文书
2015年项目工作总结
2015/04/29 职场文书
撤诉申请书法院范本
2015/05/18 职场文书
行政上诉状范文
2015/05/23 职场文书
我在伊朗长大观后感
2015/06/16 职场文书
倡议书怎么写?
2019/04/11 职场文书
熟背这些句子,让您的英语口语突飞猛进(135句)
2019/09/06 职场文书