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 对象比较实现代码
Apr 27 Javascript
JavaScript经典效果集锦
Jul 06 Javascript
深入理解JavaScript系列(9) 根本没有“JSON对象”这回事!
Jan 15 Javascript
js跨浏览器实现将字符串转化为xml对象的方法
Sep 25 Javascript
javascript实现阻止iOS APP中的链接打开Safari浏览器
Jun 12 Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
May 19 Javascript
使用JQuery实现的分页插件分享
Nov 05 Javascript
JavaScript实现的select点菜功能示例
Jan 16 Javascript
Vue.use源码分析
Apr 22 Javascript
用最简单的方法判断JavaScript中this的指向(推荐)
Sep 04 Javascript
浅谈VUE单页应用首屏加载速度优化方案
Aug 28 Javascript
JavaScript数组排序功能简单实现
May 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编程函数安全篇
2013/01/08 PHP
如何让thinkphp在模型中自动完成session赋值小教程
2014/09/05 PHP
PHP Yaf框架的简单安装使用教程(推荐)
2016/06/08 PHP
smarty循环嵌套用法示例分析
2016/07/19 PHP
PHP实现字符串的全排列详解
2019/04/24 PHP
Laravel框架中集成MongoDB和使用详解
2019/10/17 PHP
得到文本框选中的文字,动态插入文字的js代码
2007/03/07 Javascript
jquery $.ajax入门应用二
2008/11/19 Javascript
一个网马的tips实现分析
2010/11/28 Javascript
基于jquery实现的鼠标滑过按钮改变背景图片
2011/07/15 Javascript
常常会用到的截取字符串substr()、substring()、slice()方法详解
2015/12/16 Javascript
无需 Flash 使用 jQuery 复制文字到剪贴板
2016/04/26 Javascript
简单实现IONIC购物车功能
2017/01/10 Javascript
JS匹配日期和时间的正则表达式示例
2017/05/12 Javascript
AngularJS 限定$scope的范围实例详解
2017/06/23 Javascript
Vue 组件间的样式冲突污染
2017/08/31 Javascript
vue中配置mint-ui报css错误问题的解决方法
2017/10/11 Javascript
Vue+Flask实现简单的登录验证跳转的示例代码
2018/01/13 Javascript
vue 权限认证token的实现方法
2018/07/17 Javascript
jQuery实现获取及设置CSS样式操作详解
2018/09/05 jQuery
如何用RxJS实现Redux Form
2018/12/29 Javascript
JS异步执行结果获取的3种解决方式
2019/02/19 Javascript
python正则表达式match和search用法实例
2015/03/26 Python
Python读写文件方法总结
2015/06/09 Python
python实时分析日志的一个小脚本分享
2017/05/07 Python
Python聊天室程序(基础版)
2018/04/01 Python
Python Pandas 获取列匹配特定值的行的索引问题
2019/07/01 Python
Python @property装饰器原理解析
2020/01/22 Python
Tensorflow 模型转换 .pb convert to .lite实例
2020/02/12 Python
卸载tensorflow-cpu重装tensorflow-gpu操作
2020/06/23 Python
Java爬虫技术框架之Heritrix框架详解
2020/07/22 Python
英国袜子店:Sock Shop
2017/01/11 全球购物
《雨点》教学反思
2014/02/12 职场文书
关于建议书的格式范文
2014/05/20 职场文书
党风廉政承诺书2016
2016/03/25 职场文书
MySQL基础(一)
2021/04/05 MySQL