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 相关文章推荐
一个很酷的拖动层的js类,兼容IE及Firefox
Jun 23 Javascript
js history对象简单实现返回和前进
Oct 30 Javascript
js实现iframe跨页面调用函数的方法
Dec 13 Javascript
JavaScript中的分号插入机制详细介绍
Feb 11 Javascript
深入解析AngularJS框架中$scope的作用与生命周期
Mar 05 Javascript
Javascript 基础---Ajax入门必看
Jul 06 Javascript
JavaScript暂停和继续定时器的实现方法
Jul 18 Javascript
最全面的JS倒计时代码
Sep 17 Javascript
KnockoutJS 3.X API 第四章之表单value绑定
Oct 10 Javascript
微信小程序 setData的使用方法详解
Apr 20 Javascript
使用Node.js搭建静态资源服务详细教程
Aug 02 Javascript
微信小程序页面间传值与页面取值操作实例分析
Apr 30 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中的观察者模式
2010/03/24 PHP
基于Linux调试工具strace与gdb的常用命令总结
2013/06/03 PHP
从零开始学YII2框架(一)通过Composer安装Yii2框架
2014/08/20 PHP
详解PHP实现定时任务的五种方法
2016/07/25 PHP
textContent在Firefox下与innerText等效的属性
2007/05/12 Javascript
extjs form textfield的隐藏方法
2008/12/29 Javascript
javascript css在IE和Firefox中区别分析
2009/02/18 Javascript
jQuery LigerUI 使用教程入门篇
2012/01/18 Javascript
JavaScript中的稀疏数组与密集数组[译]
2012/09/17 Javascript
JavaScript转换农历类实现及调用方法
2013/01/27 Javascript
LABjs、RequireJS、SeaJS的区别
2014/03/04 Javascript
Bootstrap每天必学之表格
2015/11/23 Javascript
jQuery解析json格式数据简单实例
2016/01/22 Javascript
深入理解node exports和module.exports区别
2016/06/01 Javascript
BootStrap Table 分页后重新搜索问题的解决办法
2016/08/08 Javascript
Vue.js使用v-show和v-if的注意事项
2016/12/13 Javascript
Bootstrap CSS组件之按钮组(btn-group)
2016/12/17 Javascript
Node.js+ES6+dropload.js实现移动端下拉加载实例
2017/06/01 Javascript
vue选项卡切换登录方式小案例
2019/09/27 Javascript
vue相同路由跳转强制刷新该路由组件操作
2020/08/05 Javascript
详解template标签用法(含vue中的用法总结)
2021/01/12 Vue.js
Python异常处理总结
2014/08/15 Python
Python中的高级函数map/reduce使用实例
2015/04/13 Python
用Eclipse写python程序
2018/02/10 Python
Python 将Matrix、Dict保存到文件的方法
2018/10/30 Python
用python写一个带有gui界面的密码生成器
2020/11/06 Python
美国全球旅游运营商:Pacific Holidays
2018/06/18 全球购物
获取邓白氏信用报告:Dun & Bradstreet
2019/01/22 全球购物
泰国Robinson百货官网:购买知名品牌的商品
2020/02/08 全球购物
专科应届生求职信
2013/11/24 职场文书
个人自我评价范文
2014/02/05 职场文书
公职人员索取回扣检举信
2014/04/04 职场文书
副乡长群众路线教育实践活动个人对照检查材料
2014/09/19 职场文书
学校党的群众路线教育实践活动整改措施
2014/10/25 职场文书
2014年信用社工作总结
2014/11/25 职场文书
煤矿安全学习心得体会
2016/01/18 职场文书