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 相关文章推荐
ajax 同步请求和异步请求的差异分析
Jul 04 Javascript
javascript中的window.location.search方法简介
Sep 02 Javascript
js实现日期级联效果
Jan 23 Javascript
JavaScript格式化日期时间的方法和自定义格式化函数示例
Apr 04 Javascript
TinyMCE提交AjaxForm获取不到数据的解决方法
Mar 05 Javascript
JavaScript实现SHA-1加密算法的方法
Mar 11 Javascript
JavaScript实现广告的关闭与显示效果实例
Jul 02 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(基于jquery)
Nov 18 Javascript
javascript中Date对象的使用总结
Nov 21 Javascript
Vue导出json数据到Excel电子表格的示例
Dec 04 Javascript
Node.js中,在cmd界面,进入退出Node.js运行环境的方法
May 12 Javascript
ES6小技巧之代替lodash
Jun 07 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数组函数序列之in_array() - 查找数组中是否存在指定值
2011/11/07 PHP
php实现使用正则将文本中的网址转换成链接标签
2014/12/03 PHP
PHP判断浏览器、判断语言代码分享
2015/03/05 PHP
php实现转换ubb代码的方法
2015/06/18 PHP
PHP魔术方法之__call与__callStatic使用方法
2017/07/23 PHP
YII框架页面缓存操作示例
2019/04/29 PHP
thinkphp5.1框架实现格式化mysql时间戳为日期的方式小结
2019/10/10 PHP
使用Entrust扩展包在laravel 中实现RBAC的功能
2020/03/16 PHP
通过MSXML2自动获取QQ个人头像及在线情况(给初学者)
2007/01/22 Javascript
baidu博客的编辑友情链接的新的层窗口!经典~支持【FF】
2007/02/09 Javascript
动态控制Table的js代码
2007/03/07 Javascript
基于jquery的复制网页内容到WORD的实现代码
2011/02/16 Javascript
借助script进行Http跨域请求:JSONP实现原理及代码
2013/03/19 Javascript
JavaScript 中的日期和时间及表示标准介绍
2013/08/21 Javascript
jquery增加和删除元素的方法
2015/01/14 Javascript
JavaScript中用sort()方法对数组元素进行排序的操作
2015/06/09 Javascript
禁止按回车键提交表单的方法
2015/06/11 Javascript
基于jquery实现简单的手风琴特效
2015/11/24 Javascript
jQuery unbind 删除绑定事件详解
2016/05/24 Javascript
基于jQuery实现发送短信验证码后的倒计时功能(无视页面关闭)
2016/09/02 Javascript
vue中接口域名配置为全局变量的实现方法
2018/09/20 Javascript
[00:53]2015国际邀请赛 中国区预选赛一触即发
2015/05/14 DOTA
[01:07:47]Secret vs Optic Supermajor 胜者组 BO3 第一场 6.4
2018/06/05 DOTA
[43:57]LGD vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
Python ljust rjust center输出
2008/09/06 Python
python 3利用Dlib 19.7实现摄像头人脸检测特征点标定
2018/02/26 Python
Python绘制堆叠柱状图的实例
2019/07/09 Python
Python 进程操作之进程间通过队列共享数据,队列Queue简单示例
2019/10/11 Python
postman和python mock测试过程图解
2020/02/22 Python
html5实现的便签特效(实战分享)
2013/11/29 HTML / CSS
Shopping happy life西班牙:以最优惠的价格提供最好的时尚配饰
2020/03/13 全球购物
strstr()的简单实现
2013/09/26 面试题
医学生临床实习自我评价
2014/03/07 职场文书
检查机关党的群众路线个人整改措施
2014/10/04 职场文书
2019新员工试用期转正工作总结范文
2019/08/21 职场文书
Golang实现可重入锁的示例代码
2022/05/25 Golang