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 相关文章推荐
javascript 播放器 控制
Jan 22 Javascript
js jquery分别实现动态的文件上传操作按钮的添加和删除
Jan 13 Javascript
js的[defer]和[async]属性
Nov 24 Javascript
JavaScript实现按照指定长度为数字前面补零输出的方法
Mar 19 Javascript
jQuery Timelinr实现垂直水平时间轴插件(附源码下载)
Feb 16 Javascript
微信小程序 框架详解及实例应用
Sep 26 Javascript
使用JSON作为函数的参数的优缺点
Oct 27 Javascript
JS笛卡尔积算法与多重数组笛卡尔积实现方法示例
Dec 01 Javascript
基于wordpress的ajax写法详解
Jan 02 Javascript
Vue项目使用CDN优化首屏加载问题
Apr 01 Javascript
解决vue-cli3 使用子目录部署问题
Jul 19 Javascript
Vue-cli 移动端布局和动画使用详解
Aug 10 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
获取用户Ip地址通用方法与常见安全隐患(HTTP_X_FORWARDED_FOR)
2013/06/01 PHP
php输出含有“#”字符串的方法
2017/01/18 PHP
Yii2 加载css、js 载静态资源的方法
2017/03/10 PHP
10个基于jQuery或JavaScript的WYSIWYG 编辑器整理
2010/05/06 Javascript
jquery和css3实现的炫酷时尚的菜单导航
2014/09/01 Javascript
Javascript学习笔记之相等符号与严格相等符号
2014/11/23 Javascript
JavaScript中window.showModalDialog()用法详解
2014/12/18 Javascript
js console.log打印对像与数组用法详解
2016/01/21 Javascript
AngularJs Scope详解及示例代码
2016/09/01 Javascript
浅谈JavaScript find 方法不支持IE的问题
2017/09/28 Javascript
认识jQuery的Promise的具体使用方法
2017/10/10 jQuery
js 客户端打印html 并且去掉页眉、页脚的实例
2017/11/03 Javascript
JS实现checkbox互斥(单选)功能示例
2019/05/04 Javascript
Python采集腾讯新闻实例
2014/07/10 Python
python实现数组插入新元素的方法
2015/05/22 Python
wxPython使用系统剪切板的方法
2015/06/16 Python
python中enumerate函数遍历元素用法分析
2016/03/11 Python
python+django加载静态网页模板解析
2017/12/12 Python
python+opencv实现霍夫变换检测直线
2020/10/23 Python
pandas去重复行并分类汇总的实现方法
2019/01/29 Python
如何解决tensorflow恢复模型的特定值时出错
2020/02/06 Python
python topk()函数求最大和最小值实例
2020/04/02 Python
Pytorch数据拼接与拆分操作实现图解
2020/04/30 Python
基于Python第三方插件实现西游记章节标注汉语拼音的方法
2020/05/22 Python
Python extract及contains方法代码实例
2020/09/11 Python
优秀毕业生自我鉴定
2014/02/11 职场文书
企业整改报告范文
2014/11/08 职场文书
教师个人考察材料
2014/12/16 职场文书
丽江古城导游词
2015/02/03 职场文书
民主评议党员个人总结
2015/02/13 职场文书
上市公司董事长岗位职责
2015/04/16 职场文书
2015年度保密工作总结
2015/04/24 职场文书
财务管理制度范本
2015/08/04 职场文书
Angular性能优化之第三方组件和懒加载技术
2021/05/10 Javascript
mysql5.5中文乱码问题解决的有用方法
2022/05/30 MySQL
WinServer2012搭建DNS服务器的方法步骤
2022/06/10 Servers