js处理包含中文的字符串实例


Posted in Javascript onOctober 11, 2017

场景:

js中String类型自带的属性length获取的是字符串的字符数目,但是前端经常会需要限制字符串的显示长度,一个中文字符又大概占两个英文小写字符的显示位置,所以中英文混合的情况下用length值来判断显示长度往往并不正确。

常规的解决办法是遍历字符串,中文字符计长度2,非中文字符计长度1,通过新计算出来长度总和来限制字符串的显示长度。看代码↓↓↓

var Tools ={
 //是否包含中文
 hasZh: function(str){
  for(var i = 0;i < str.length; i++)
  {
   if(str.charCodeAt(i) > 255) //如果是汉字,则字符串长度加2
    return true;
   return false;
  }
 },
 //重新计算长度,中文+2,英文+1
 getlen: function(str){
  var strlen = 0;
  for(var i = 0;i < str.length; i++)
  {
   if(str.charCodeAt(i) > 255) //如果是汉字,则字符串长度加2
    strlen += 2;
   else
    strlen++;
  }
  return strlen;
 },
 //限制长度
 limitlen: function(str, len){
  var result = "";
  var strlen = 0;
  for(var i = 0;i < str.length; i++)
  {
   if(str.charCodeAt(i) > 255) //如果是汉字,则字符串长度加2
    strlen += 2;
   else
    strlen++;

   result += str.substr(i,1);

   if(strlen >= len){
    break;
   }
  }
  return result;
 }
}

这种方法的原理是根据中英文的unicode编码范围不同来判断的,中文占2个字节,英文占1个字节,所以中文的unicode编码值肯定大于2^8-1=255。

上述方法可以更严谨一点:就是考虑unicode编码范围,具体的范围可以戳Unicode Table

PS: 汉字的unicode编码范围16进制为4E00-9FA5,10进制则为:19968-40869,即判断中文的准确表达式为:

str.charCodeAt(i)>=19968 && str.charCodeAt(i)<=40869

插一句不太严谨的话,代码不用限制太严谨的范围,毕竟你不知道用户(测试)会输哪些奇怪的东西。

以上这篇js处理包含中文的字符串实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
使用正则表达式的格式化与高亮显示json字符串
Dec 03 Javascript
基于JQuery实现仿网易邮箱全屏动感滚动插件fullPage
Sep 20 Javascript
javascript图片延迟加载实现方法及思路
Dec 31 Javascript
浅谈JavaScript中面向对象的的深拷贝和浅拷贝
Aug 01 Javascript
BootStrop前端框架入门教程详解
Dec 25 Javascript
微信小程序 wx:for的使用实例详解
Apr 27 Javascript
js实现HTML中Select二级联动的实例
Jan 05 Javascript
关于axios如何全局注册浅析
Jan 14 Javascript
cdn模式下vue的基本用法详解
Oct 07 Javascript
解决layui动态加载复选框无法选中的问题
Sep 20 Javascript
js实现随机圆与矩形功能
Oct 29 Javascript
在HTML5 localStorage中存储对象的示例代码
Apr 21 Javascript
解决JQuery全选/反选第二次失效的问题
Oct 11 #jQuery
React根据宽度自适应高度的示例代码
Oct 11 #Javascript
详解vue中使用express+fetch获取本地json文件
Oct 10 #Javascript
vue router自动判断左右翻页转场动画效果
Oct 10 #Javascript
angular2 ng2 @input和@output理解及示例
Oct 10 #Javascript
ionic选择多张图片上传的示例代码
Oct 10 #Javascript
详解ionic本地相册、拍照、裁剪、上传(单图完全版)
Oct 10 #Javascript
You might like
一个数据采集类
2007/02/14 PHP
php写入mysql中文乱码的实例解决方法
2019/09/17 PHP
BOOM vs RR BO3 第二场2.13
2021/03/10 DOTA
Javascript操纵Cookie实现购物车程序
2006/11/23 Javascript
IE iframe的onload方法分析小结
2010/01/07 Javascript
IE6中使用position导致页面变形的解决方案(js代码)
2011/01/09 Javascript
javascript 判断中文字符长度的函数代码
2012/08/27 Javascript
location.href用法总结(最主要的)
2013/12/27 Javascript
JS保留两位小数,多位小数的示例代码
2014/01/07 Javascript
js星星评分效果
2014/07/24 Javascript
BootStrap的JS插件之轮播效果案例详解
2016/05/16 Javascript
JQuery 的跨域方法推荐_可跨任何网站
2016/05/18 Javascript
JavaScript检测原始值、引用值、属性
2016/06/20 Javascript
再谈Javascript中的异步以及如何异步
2016/08/19 Javascript
利用bootstrapValidator验证UEditor
2016/09/14 Javascript
Angular指令之restict匹配模式的详解
2017/07/27 Javascript
详解webpack进阶之loader篇
2017/08/23 Javascript
angular中不同的组件间传值与通信的方法
2017/11/04 Javascript
JavaScript实现微信红包算法及问题解决方法
2018/04/26 Javascript
Spring boot 和Vue开发中CORS跨域问题解决
2018/09/05 Javascript
Vue结合后台导入导出Excel问题详解
2019/02/19 Javascript
javascript实现blob加密视频源地址的方法
2019/08/08 Javascript
JS co 函数库的含义和用法实例总结
2020/04/08 Javascript
利用python GDAL库读写geotiff格式的遥感影像方法
2018/11/29 Python
利用Python绘制Jazz网络图的例子
2019/11/21 Python
Python和Sublime整合过程图示
2019/12/25 Python
python 定义类时,实现内部方法的互相调用
2019/12/25 Python
完美解决keras 读取多个hdf5文件进行训练的问题
2020/07/01 Python
如何使用localstorage代替cookie实现跨域共享数据问题
2018/04/18 HTML / CSS
美国工业用品采购网站:Zoro.com
2020/10/27 全球购物
大学生优秀的自我评价分享
2013/10/22 职场文书
2014年两会学习心得体会
2014/03/10 职场文书
学校庆元旦歌咏比赛主持词
2014/03/18 职场文书
国际经济与贸易专业求职信
2014/07/10 职场文书
企业安全生产责任书范本
2014/07/28 职场文书
OpenCV中resize函数插值算法的实现过程(五种)
2021/06/05 Python