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 相关文章推荐
JavaScript实现带标题的图片轮播特效
May 20 Javascript
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证
Jun 25 Javascript
jQuery获取与设置iframe高度的方法
Aug 01 Javascript
利用浮层使select不可选的实现方法
Dec 03 Javascript
jQuery实现圣诞节礼物动画案例解析
Dec 25 Javascript
简单实现jQuery手风琴效果
Aug 18 jQuery
vue实现页面加载动画效果
Sep 19 Javascript
Vue实战之vue登录验证的实现代码
Oct 31 Javascript
Angular5中提取公共组件之radio list的实例代码
Jul 10 Javascript
微信小程序自定义导航栏
Dec 31 Javascript
弱类型语言javascript中 a,b 的运算实例小结
Aug 07 Javascript
实例讲解React 组件生命周期
Jul 08 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
php设置编码格式的方法
2013/03/05 PHP
Zend的MVC机制使用分析(一)
2013/05/02 PHP
php+mysqli批量查询多张表数据的方法
2015/01/29 PHP
使用PHPWord生成word文档的方法详解
2019/06/06 PHP
TP5框架请求响应参数实例分析
2019/10/17 PHP
Aster vs KG BO3 第一场2.18
2021/03/10 DOTA
jQuery选择没有colspan属性的td的代码
2010/07/06 Javascript
js css后面所带参数含义介绍
2013/08/18 Javascript
js实现简单登录功能的实例代码
2013/11/09 Javascript
JavaScript中Math对象方法使用概述
2014/01/02 Javascript
JS实现可自定义大小,可双击关闭的弹出层效果
2015/10/16 Javascript
jQuery实现悬浮在右上角的网页客服效果代码
2015/10/24 Javascript
JavaScript严格模式详解
2015/11/18 Javascript
轻松实现JavaScript图片切换
2016/01/12 Javascript
JavaScript事件学习小结(一)事件流
2016/06/09 Javascript
jQuery模拟实现的select点击选择效果【附demo源码下载】
2016/11/09 Javascript
使用BootStrap实现表格隔行变色及hover变色并在需要时出现滚动条
2017/01/04 Javascript
关于HTML5的data-*自定义属性的总结
2018/05/05 Javascript
Antd的table组件表格的序号自增操作
2020/10/27 Javascript
Python合并两个字典的常用方法与效率比较
2015/06/17 Python
Python中条件判断语句的简单使用方法
2015/08/21 Python
Python的Flask框架及Nginx实现静态文件访问限制功能
2016/06/27 Python
python实现多层感知器
2019/01/18 Python
Python占用的内存优化教程
2019/07/28 Python
Python numpy数组转置与轴变换
2019/11/15 Python
如何将 awk 脚本移植到 Python
2019/12/09 Python
python数据类型强制转换实例详解
2020/06/22 Python
GUESS西班牙官方网上商城:美国服饰品牌
2017/03/15 全球购物
个人租房协议书范本
2014/09/30 职场文书
2015年语文教师工作总结
2015/05/25 职场文书
2016年领导干部廉政承诺书
2016/03/24 职场文书
python实现监听键盘
2021/04/26 Python
JavaScript异步操作中串行和并行
2021/11/20 Javascript
Win11安装升级时提示“该电脑必须支持安全启动”
2022/04/19 数码科技
使用Python开发贪吃蛇游戏 SnakeGame
2022/04/30 Python
CSS实现鼠标悬浮动画特效
2023/05/07 HTML / CSS