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 相关文章推荐
表单填写时用回车代替TAB的实现方法
Oct 09 Javascript
MooTools 1.2中的Drag.Move来实现拖放
Sep 15 Javascript
JavaScript学习笔记(十七)js 优化
Feb 04 Javascript
基于jquery的内容循环滚动小模块(仿新浪微博未登录首页滚动微博显示)
Mar 28 Javascript
JavaScript与DOM组合动态创建表格实例
Dec 23 Javascript
AngularJS基础 ng-open 指令简单实例
Aug 02 Javascript
Node.js学习之查询字符串解析querystring详解
Sep 28 Javascript
解决Vue 浏览器后退无法触发beforeRouteLeave的问题
Dec 24 Javascript
highCharts提示框中显示当前时间的方法
Jan 18 Javascript
bootstrap-table formatter 使用vue组件的方法
May 09 Javascript
JS中数据结构与算法---排序算法(Sort Algorithm)实例详解
Jun 17 Javascript
微信小程序实现天气预报功能(附源码)
Dec 10 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
解析web文件操作常见安全漏洞(目录、文件名检测漏洞)
2013/06/29 PHP
PHP基于单例模式实现的数据库操作基类
2016/01/15 PHP
类之Prototype.js学习
2007/06/13 Javascript
纯js实现背景图片切换效果代码
2010/11/14 Javascript
script标签属性type与language使用选择
2012/12/02 Javascript
JS隐藏参数post传值实例
2013/04/18 Javascript
js动态添加事件并可传参数示例代码
2013/10/21 Javascript
使用Chrome浏览器调试AngularJS应用的方法
2015/06/18 Javascript
Underscore.js 1.3.3 中文注释翻译说明
2015/06/25 Javascript
基于jQuery实现自动轮播旋转木马特效
2015/11/02 Javascript
javascript HTML5文件上传FileReader API
2020/03/27 Javascript
浅谈js函数中的实例对象、类对象、局部变量(局部函数)
2016/11/20 Javascript
JS中type=&quot;button&quot;和type=&quot;submit&quot;的区别
2017/07/04 Javascript
vue的diff算法知识点总结
2018/03/29 Javascript
微信小程序使用websocket通讯的demo,含前后端代码,亲测可用
2019/05/22 Javascript
JS判断数组四种实现方法详解
2020/06/29 Javascript
tensorflow实现softma识别MNIST
2018/03/12 Python
python实现猜数字小游戏
2020/03/24 Python
python-itchat 统计微信群、好友数量,及原始消息数据的实例
2019/02/21 Python
详解用python生成随机数的几种方法
2019/08/04 Python
Python使用itchat模块实现群聊转发,自动回复功能示例
2019/08/26 Python
Python之——生成动态路由轨迹图的实例
2019/11/22 Python
html5-Canvas可以在web中绘制各种图形
2012/12/26 HTML / CSS
linux系统都有哪些运行级别
2012/04/15 面试题
简历的自荐信
2013/12/19 职场文书
顶撞老师检讨书
2014/02/07 职场文书
地理教师岗位职责
2014/03/16 职场文书
《周恩来的四个昼夜》观后思想汇报范文两篇
2014/09/10 职场文书
群众路线调研报告范文
2014/11/03 职场文书
健康证明
2015/06/19 职场文书
锦旗赠语
2015/06/23 职场文书
母亲去世追悼词
2015/06/23 职场文书
2016年班主任新年寄语
2015/08/18 职场文书
家访教师心得体会
2016/01/23 职场文书
教你使用Jenkins集成Harbor自动发布镜像
2022/04/03 Servers
WIN10使用IIS部署ftp服务器详细教程
2022/08/05 Servers