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 30 Javascript
JavaScript 权威指南(第四版) 读书笔记
Aug 11 Javascript
javascript(jquery)利用函数修改全局变量的代码
Nov 02 Javascript
IE6-8中Date不支持toISOString的修复方法
May 04 Javascript
js统计录入文本框中字符的个数并加以限制不超过多少
May 23 Javascript
jQuery+css实现的切换图片功能代码
Jan 27 Javascript
jQuery文字横向滚动效果的实现代码
May 31 Javascript
利用fecha进行JS日期处理
Nov 21 Javascript
vue实现键盘输入支付密码功能
Aug 18 Javascript
node上的redis调用优化示例详解
Oct 30 Javascript
JS常见错误(Error)及处理方案详解
Jul 02 Javascript
vue 实现tab切换保持数据状态
Jul 21 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跨服务器访问方法小结
2015/05/12 PHP
php操作MongoDB类实例
2015/06/17 PHP
Jquery 高亮显示文本中重要的关键字
2009/12/24 Javascript
js 图片等比例缩放代码
2010/05/13 Javascript
jquery实现marquee效果(文字或者图片的水平垂直滚动)
2013/01/07 Javascript
JavaScript对象创建及继承原理实例解剖
2013/02/28 Javascript
JavaScript中的Math.E属性使用详解
2015/06/12 Javascript
JS代码实现根据时间变换页面背景效果
2016/06/16 Javascript
nodejs+websocket实时聊天系统改进版
2017/05/18 NodeJs
React+react-dropzone+node.js实现图片上传的示例代码
2017/08/23 Javascript
Vue中computed与methods的区别详解
2018/03/24 Javascript
angular4中引入echarts的方法示例
2019/01/29 Javascript
TypeScript类型声明书写详解
2019/08/28 Javascript
Python简单获取自身外网IP的方法
2016/09/18 Python
Python搭建HTTP服务器和FTP服务器
2017/03/09 Python
Python网络爬虫神器PyQuery的基本使用教程
2018/02/03 Python
使用k8s部署Django项目的方法步骤
2019/01/14 Python
python yield关键词案例测试
2019/10/15 Python
python接口自动化框架实战
2020/12/23 Python
python中使用np.delete()的实例方法
2021/02/01 Python
限量版运动鞋和街头服饰:TheDrop
2020/09/06 全球购物
个人简历自我评价八例
2013/10/31 职场文书
汽车维修专业个人求职信范文
2014/01/01 职场文书
小区消防演习方案
2014/02/21 职场文书
我的中国梦演讲稿初中篇
2014/08/19 职场文书
党的群众路线对照检查材料范文
2014/09/24 职场文书
2014年信息技术工作总结
2014/12/16 职场文书
黄山导游词
2015/01/31 职场文书
安全生产先进个人总结
2015/02/15 职场文书
工程质检员岗位职责
2015/04/08 职场文书
学生会主席任命书
2015/09/21 职场文书
机械生产实习心得体会
2016/01/22 职场文书
掌握一个领域知识,高效学习必备方法
2019/08/08 职场文书
python for循环赋值问题
2021/06/03 Python
进行数据处理的6个 Python 代码块分享
2022/04/06 Python
PHP正则表达式之RCEService回溯
2022/04/11 PHP