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获取GridView中用户点击控件的行号,列号
Apr 14 Javascript
Javascript中的回调函数和匿名函数的回调示例介绍
May 12 Javascript
JS实现清除指定cookies的方法
Sep 20 Javascript
TypeScript具有的几个不同特质
Apr 07 Javascript
jQuery检测输入的字符串包含的中英文的数量
Apr 17 Javascript
JS实现随页面滚动显示/隐藏窗口固定位置元素
Feb 26 Javascript
AngularJs html compiler详解及示例代码
Sep 01 Javascript
分析javascript原型及原型链
Mar 18 Javascript
Vue全局分页组件的实现代码
Aug 10 Javascript
VUE+Element UI实现简单的表格行内编辑效果的示例的代码
Oct 31 Javascript
Node.js实现简单的爬取的示例代码
Jun 25 Javascript
layer弹出层扩展主题的方法
Sep 11 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/04/09 PHP
队列在编程中的实际应用(php)
2010/09/04 PHP
QQ登录 PHP OAuth示例代码
2011/07/20 PHP
PHP给源代码加密的几种方法汇总(推荐)
2018/02/06 PHP
详解php与ethereum客户端交互
2018/04/28 PHP
表单填写时用回车代替TAB的实现方法
2007/10/09 Javascript
jquery 常用操作方法
2010/01/28 Javascript
javascript alert乱码的解决方法
2013/11/05 Javascript
使用原生js封装webapp滑动效果(惯性滑动、滑动回弹)
2014/05/06 Javascript
JavaScript实现将数组中所有元素连接成一个字符串的方法
2015/04/06 Javascript
jQuery+JSON实现AJAX二级联动实例分析
2015/12/18 Javascript
再次谈论React.js实现原生js拖拽效果引起的一系列问题
2016/04/03 Javascript
jQuery实用小技巧_输入框文字获取和失去焦点的简单实例
2016/08/25 Javascript
详解js数组的完全随机排列算法
2016/12/16 Javascript
JS基于面向对象实现的选项卡效果示例
2016/12/20 Javascript
Vue+axios 实现http拦截及路由拦截实例
2017/04/25 Javascript
JS组件系列之JS组件封装过程详解
2017/04/28 Javascript
jQuery选择器中的特殊符号处理方法
2017/09/08 jQuery
微信小程序实现人脸检测功能
2018/05/25 Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
2019/07/26 jQuery
Vue指令实现OutClick的示例
2020/11/16 Javascript
vue 递归组件的简单使用示例
2021/01/14 Vue.js
Python实现抓取网页并且解析的实例
2014/09/20 Python
详解Python中的正则表达式的用法
2015/04/09 Python
Python科学计算之Pandas详解
2017/01/15 Python
使用Python脚本和ADB命令实现卸载App
2017/02/10 Python
Python元组操作实例分析【创建、赋值、更新、删除等】
2017/07/24 Python
Python中XlsxWriter模块简介与用法分析
2018/04/24 Python
tornado+celery的简单使用详解
2019/12/21 Python
pytorch实现Tensor变量之间的转换
2020/02/17 Python
python正则表达式实例代码
2020/03/03 Python
一份比较全的PHP面试题
2016/07/29 面试题
杨善洲电影观后感
2015/06/04 职场文书
Python通过m3u8文件下载合并ts视频的操作
2021/04/16 Python
python 经纬度求两点距离、三点面积操作
2021/06/03 Python
Android Flutter实现3D动画效果示例详解
2022/04/07 Java/Android