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 相关文章推荐
cookie的secure属性详解
Apr 08 Javascript
JavaScript组件开发完整示例
Dec 15 Javascript
jQuery实现的指纹扫描效果实例(附演示与demo源码下载)
Jan 26 Javascript
手机端实现Bootstrap简单图片轮播效果
Oct 13 Javascript
微信小程序实战之上拉(分页加载)效果(2)
Apr 17 Javascript
jQuery插件ImgAreaSelect实现头像上传预览和裁剪功能实例讲解一
May 26 jQuery
jQuery Ajax 实现分页 kkpager插件实例代码
Aug 10 jQuery
AngularJS 控制器 controller的详解
Oct 17 Javascript
详解Vue 事件修饰符capture 的使用
Dec 29 Javascript
vue脚手架及vue-router基本使用
Apr 09 Javascript
如何让node运行es6模块文件及其原理详解
Dec 11 Javascript
微信小程序实现联动选择器
Feb 15 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
从一个不错的留言本弄的mysql数据库操作类
2007/09/02 PHP
php阳历转农历优化版
2016/08/08 PHP
phpStudy vscode 搭建debug调试的教程详解
2020/07/28 PHP
getElementsByTagName vs selectNodes效率 及兼容的selectNodes实现
2010/02/26 Javascript
js文件Cookie存取值示例代码
2014/02/20 Javascript
JQuery实现表格动态增加行并对新行添加事件
2014/07/30 Javascript
javascript 获取函数形参个数
2014/07/31 Javascript
javascript函数声明和函数表达式区别分析
2014/12/02 Javascript
JavaScript对象学习小结
2015/09/02 Javascript
JavaScript iframe数据共享接口实现方法
2016/01/06 Javascript
jquery遍历json对象集合详解
2016/05/18 Javascript
JavaScript的Vue.js库入门学习教程
2016/05/23 Javascript
解决vue.js在编写过程中出现空格不规范报错的问题
2017/09/20 Javascript
前后端常见的几种鉴权方式(小结)
2019/08/04 Javascript
国内常用的js类库大全(CDN公共库)
2020/06/24 Javascript
Vue实现圆环进度条的示例
2021/02/06 Vue.js
[35:27]完美世界DOTA2联赛循环赛 GXR vs FTD BO2第二场 10.29
2020/10/29 DOTA
Python 元组(Tuple)操作详解
2014/03/11 Python
Python实现的简单发送邮件脚本分享
2014/11/07 Python
Python pyinotify日志监控系统处理日志的方法
2018/03/08 Python
Python绘制3D图形
2018/05/03 Python
PyCharm的设置方法和第一个Python程序的建立
2019/01/16 Python
selenium+python自动化测试之多窗口切换
2019/01/23 Python
Python 获取命令行参数内容及参数个数的实例
2019/12/20 Python
Notino意大利:购买香水和化妆品
2018/11/14 全球购物
荷兰时尚精品店:Labels Fashion
2020/03/22 全球购物
学生操行评语大全
2014/04/24 职场文书
正科级干部考察材料
2014/05/29 职场文书
班级口号大全
2014/06/09 职场文书
2014年客房服务员工作总结
2014/11/18 职场文书
教师正风肃纪心得体会
2016/01/15 职场文书
课文《燕子》教学反思
2016/02/17 职场文书
财产分割协议书
2016/03/22 职场文书
使用CSS实现小三角边框原理解析
2021/11/07 HTML / CSS
一文弄懂MySQL中redo log与binlog的区别
2022/02/15 MySQL
一篇文章弄清楚Ajax请求的五个步骤
2022/03/17 Javascript