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 相关文章推荐
JavaScript 权威指南(第四版) 读书笔记
Aug 11 Javascript
XHTML下,JS浮动代码失效的问题
Nov 12 Javascript
基于jquery的一个OutlookBar类,动态创建导航条
Nov 19 Javascript
基于JQuery实现鼠标点击文本框显示隐藏提示文本
Feb 23 Javascript
根据身份证号自动输出相关信息(籍贯,出身日期,性别)
Nov 15 Javascript
js关于字符长度限制的问题示例探讨
Jan 24 Javascript
JavaScript父子窗体间的调用方法
Mar 31 Javascript
JQuery插件jcarousellite的参数中文说明
May 11 Javascript
jQuery内存泄露解决办法
Dec 13 Javascript
如何更好的编写js async函数
May 13 Javascript
解决vuex数据异步造成初始化的时候没值报错问题
Nov 13 Javascript
vue项目创建步骤及路由router
Jan 14 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
php 带逗号千位符数字的处理方法
2012/01/10 PHP
Docker 如何布置PHP开发环境
2016/06/21 PHP
php实现通过soap调用.Net的WebService asmx文件
2017/02/27 PHP
JQuery 遮罩层实现(mask)实现代码
2010/01/09 Javascript
jQuery实现的进度条效果
2015/07/15 Javascript
AJAX实现瀑布流触发分页与分页触发瀑布流的方法
2016/05/23 Javascript
js数组的五种迭代方法及两种归并方法(推荐)
2016/06/14 Javascript
基于jQuery的checkbox全选问题分析
2016/11/18 Javascript
JavaScript易错知识点整理
2016/12/05 Javascript
js输入框使用正则表达式校验输入内容的实例
2017/02/12 Javascript
深究AngularJS中ng-drag、ng-drop的用法
2017/06/12 Javascript
JavaScript实现二维坐标点排序效果
2017/07/18 Javascript
微信小程序ajax实现请求服务器数据及模版遍历数据功能示例
2017/12/15 Javascript
利用webpack理解CommonJS和ES Modules的差异区别
2020/06/16 Javascript
[04:27]DOTA2官方论坛水友赛集锦
2013/09/16 DOTA
Python-嵌套列表list的全面解析
2016/06/08 Python
python 实现一个贴吧图片爬虫的示例
2017/10/12 Python
解决python web项目意外关闭,但占用端口的问题
2019/12/17 Python
python 如何利用argparse解析命令行参数
2020/09/11 Python
kmart凯马特官网:美国最大的打折零售商和全球最大的批发商之一
2016/11/17 全球购物
美国时尚大码女装购物网站:Avenue
2019/05/24 全球购物
开发中都用到了那些设计模式?用在什么场合?
2014/08/21 面试题
华三通信H3C面试题
2015/05/15 面试题
电子技术专业中专生的自我评价
2013/12/17 职场文书
关于打架的检讨书
2014/01/17 职场文书
会计顶岗实习心得
2014/01/25 职场文书
学历公证书范本
2014/04/09 职场文书
建设单位项目负责人任命书
2014/06/06 职场文书
计算机相关专业自荐信
2014/07/02 职场文书
美术专业自荐信
2014/07/07 职场文书
专业见习报告范文
2014/11/03 职场文书
党员示范岗材料
2014/12/19 职场文书
2015社区健康教育工作总结
2015/05/20 职场文书
教师个人工作总结范文2015
2015/10/14 职场文书
优质护理心得体会
2016/01/22 职场文书
Django分页器的用法你都了解吗
2021/05/26 Python