JS字符串长度判断,超出进行自动截取的实例(支持中文)


Posted in Javascript onMarch 06, 2017

今天一个小弟问我的问题,在文本框中输入字符,如果超出指定长度,就把它截取,要求中文等于两个字符的长度,我找一下资料,把这个功能实现了,

下面是JS代码:

<html>
<script src="http://3water.com/script/jquery.js" type="text/javascript"></script>

<body>
  <input type="text" name="username" />
</body>
<script type="text/ecmascript">

  
  var GetLength = function (str) {
    ///<summary>获得字符串实际长度,中文2,英文1</summary>
    ///<param name="str">要获得长度的字符串</param>
    var realLength = 0, len = str.length, charCode = -1;
    for (var i = 0; i < len; i++) {
      charCode = str.charCodeAt(i);
      if (charCode >= 0 && charCode <= 128) realLength += 1;
      else realLength += 2;
    }
    return realLength;
  };

  //js截取字符串,中英文都能用 
  //如果给定的字符串大于指定长度,截取指定长度返回,否者返回源字符串。 
  //字符串,长度 

  /** 
   * js截取字符串,中英文都能用 
   * @param str:需要截取的字符串 
   * @param len: 需要截取的长度 
   */
  function cutstr(str, len) {
    var str_length = 0;
    var str_len = 0;
    str_cut = new String();
    str_len = str.length;
    for (var i = 0; i < str_len; i++) {
      a = str.charAt(i);
      str_length++;
      if (escape(a).length > 4) {
        //中文字符的长度经编码之后大于4 
        str_length++;
      }
      str_cut = str_cut.concat(a);
      if (str_length >= len) {
        str_cut = str_cut.concat("...");
        return str_cut;
      }
    }
    //如果给定字符串小于指定长度,则返回源字符串; 
    if (str_length < len) {
      return str;
    }
  }$(function () { 
   $("input[name=username]").bind('keyup', function () {
   if (GetLength($(this).val()) > 10) { 
    $(this).val(cutstr($(this).val(), 10)); 
    return; 
   } 
 }); 
}); 
</script> 
</html>

效果如图:

JS字符串长度判断,超出进行自动截取的实例(支持中文)

以上这篇JS字符串长度判断,超出进行自动截取的实例(支持中文)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery控制的不同方向的滑动(向左、向右滑动等)
Jul 18 Javascript
JavaScript验证18位身份证号码最后一位正确性的实现代码
Aug 07 Javascript
JavaScript中document.forms[0]与getElementByName区别
Jan 21 Javascript
浅谈Javascript中substr和substring的区别
Sep 30 Javascript
详解自动生成博客目录案例
Dec 09 Javascript
微信小程序实现全国机场索引列表
Jan 31 Javascript
Node.js应用设置安全的沙箱环境
Apr 23 Javascript
微信小程序单选radio及多选checkbox按钮用法示例
Apr 30 Javascript
jQuery实现文本显示一段时间后隐藏的方法分析
Jun 20 jQuery
JS实现吸顶特效
Jan 08 Javascript
vue中echarts图表大小适应窗口大小且不需要刷新案例
Jul 19 Javascript
微信小程序入门之指南针
Oct 22 Javascript
Bootstrap导航简单实现代码
Mar 06 #Javascript
Bootstrap栅格系统简单实现代码
Mar 06 #Javascript
javascript DOM的详解及实例代码
Mar 06 #Javascript
vue + socket.io实现一个简易聊天室示例代码
Mar 06 #Javascript
EasyUI为Numberbox添加blur事件的方法
Mar 05 #Javascript
Web开发中客户端的跳转与服务器端的跳转的区别
Mar 05 #Javascript
js获取元素下的第一级子元素的方法(推荐)
Mar 05 #Javascript
You might like
PHP生成不同颜色、不同大小的tag标签函数
2013/09/23 PHP
php解析json数据实例
2014/08/19 PHP
ThinkPHP中order()使用方法详解
2016/04/19 PHP
PHP Callable强制指定回调类型的方法
2016/08/30 PHP
php的api数据接口书写实例(推荐)
2016/09/22 PHP
php array_keys 返回数组的键名
2016/10/25 PHP
PHP单元测试框架PHPUnit用法详解
2019/01/23 PHP
Alliance vs AM BO3 第一场2.13
2021/03/10 DOTA
用javascript实现点击链接弹出&quot;图片另存为&quot;而不是直接打开
2007/08/15 Javascript
Javascript代码在页面加载时的执行顺序介绍
2013/05/03 Javascript
Javascript和Java获取各种form表单信息的简单实例
2014/02/14 Javascript
js实现分享到随页面滚动而滑动效果的方法
2015/04/10 Javascript
JavaScript实现为指定对象添加多个事件处理程序的方法
2015/04/17 Javascript
全面解析JS字符串和正则表达式中的match、replace、exec等函数
2016/07/01 Javascript
JS定时检测任务任务完成后执行下一步的解决办法
2016/12/22 Javascript
vue input输入框模糊查询的示例代码
2018/05/22 Javascript
详解Vue一个案例引发「内容分发slot」的最全总结
2018/12/02 Javascript
JS开发常用工具函数(小结)
2019/07/04 Javascript
只有 20 行的 JavaScript 模板引擎实例详解
2020/05/11 Javascript
八种Vue组件间通讯方式合集(推荐)
2020/08/18 Javascript
Python对两个有序列表进行合并和排序的例子
2014/06/13 Python
python多进程实现进程间通信实例
2017/11/24 Python
django框架模板中定义变量(set variable in django template)的方法分析
2019/06/24 Python
用python对excel查重
2020/12/07 Python
你的自行车健身专家:FaFit24
2016/11/16 全球购物
什么是servlet链?
2014/07/13 面试题
文明学生事迹材料
2014/01/29 职场文书
初中学生期末评语
2014/04/24 职场文书
共产党员公开承诺践诺书
2014/05/28 职场文书
2014年挂职干部工作总结
2014/12/06 职场文书
离婚起诉状范本
2015/05/19 职场文书
2015年信息中心工作总结
2015/05/25 职场文书
素质拓展训练感想
2015/08/07 职场文书
2019新员工试用期转正申请书3篇
2019/08/13 职场文书
Java 实现限流器处理Rest接口请求详解流程
2021/11/02 Java/Android
MySQL学习必备条件查询数据
2022/03/25 MySQL