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 相关文章推荐
js 实现菜单上下显示附效果图
Nov 21 Javascript
通过js为元素添加多项样式,浏览器全兼容写法
Aug 30 Javascript
jquery中trigger()无法触发hover事件的解决方法
May 07 Javascript
JavaScript html5 canvas绘制时钟效果
Mar 01 Javascript
JavaScript ES6的新特性使用新方法定义Class
Jun 28 Javascript
正则验证小数点后面只能有两位数的方法
Feb 28 Javascript
基于JavaScript实现验证码功能
Apr 01 Javascript
vue-cli + sass 的正确打开方式图文详解
Oct 27 Javascript
JS实现导出Excel的五种方法详解【附源码下载】
Mar 15 Javascript
浅谈React碰到v-if
Nov 04 Javascript
解决layer弹出层msg的文字不显示的问题
Sep 11 Javascript
vue+iview使用树形控件的具体使用
Nov 02 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
浅谈电磁辐射对健康的影响
2021/03/01 无线电
PHP中通过trigger_error触发PHP错误示例
2015/06/23 PHP
PHP设计模式之原型模式定义与用法详解
2018/04/03 PHP
JS中字符问题(二进制/十进制/十六进制及ASCII码之间的转换)
2008/11/03 Javascript
Javascript 读书笔记索引贴
2010/01/11 Javascript
Javascript排序算法之计数排序的实例
2014/04/05 Javascript
与Math.pow 相反的函数使用介绍
2014/08/04 Javascript
jQuery实现自动切换播放的经典滑动门效果
2015/09/12 Javascript
jQuery删除当前节点元素
2016/12/07 Javascript
Bootstrap下拉菜单Dropdowns的实现代码
2017/03/17 Javascript
jquery图片放大镜效果
2017/06/23 jQuery
详解js静态资源文件请求的处理
2017/08/01 Javascript
angularJs select绑定的model取不到值的解决方法
2018/10/08 Javascript
Vue实现购物车的全选、单选、显示商品价格代码实例
2019/05/06 Javascript
vuex存储复杂参数(如对象数组等)刷新数据丢失的解决方法
2019/11/05 Javascript
Vue中ref和$refs的介绍以及使用方法示例
2021/01/11 Vue.js
[01:00:06]加油DOTA_EP01_网络版
2014/08/09 DOTA
[47:42]完美世界DOTA2联赛PWL S2 GXR vs Ink 第一场 11.19
2020/11/20 DOTA
[46:14]完美世界DOTA2联赛PWL S3 Magma vs INK ICE 第一场 12.11
2020/12/16 DOTA
python根据经纬度计算距离示例
2014/02/16 Python
利用Python实现简单的相似图片搜索的教程
2015/04/23 Python
Python编写登陆接口的方法
2017/07/10 Python
几个CSS3的flex弹性盒模型布局的简单例子演示
2016/05/12 HTML / CSS
Merchant 1948澳大利亚:新西兰领先的鞋类和靴子供应商
2018/03/24 全球购物
美国传奇滑手Paul Rodriguez创办的街头滑板品牌:Primitive Skateboarding
2019/10/29 全球购物
英国高街奥特莱斯:Highstreet Outlet
2019/11/21 全球购物
写一个函数,求一个字符串的长度。在main函数中输入字符串,并输出其长度
2015/11/18 面试题
TCP协议通讯的过程和步骤是什么
2015/10/18 面试题
公司部门司机岗位职责
2014/01/03 职场文书
《宿建德江》教学反思
2014/04/23 职场文书
教师读书活动总结
2014/05/07 职场文书
募捐感谢信
2015/01/22 职场文书
2015入党自传格式范文
2015/06/26 职场文书
诺贝尔奖获得者名言100句:句句启人心智,值永久收藏
2019/08/09 职场文书
用Python实现Newton插值法
2021/04/17 Python
如何正确理解python装饰器
2021/06/15 Python