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 For Beginners(转载)
Jan 05 Javascript
漂亮的widgets,支持换肤和后期开发新皮肤(2007-4-27已更新1.7alpha)
Apr 27 Javascript
IE DOM实现存在的部分问题及解决方法
Jul 25 Javascript
jquery 多行文本框(textarea)高度变化
Jul 03 Javascript
JavaScript获取多个数组的交集简单实例
Nov 11 Javascript
JS去掉第一个字符和最后一个字符的实现代码
Feb 20 Javascript
使用Node.js实现HTTP 206内容分片的教程
Jun 23 Javascript
js文本框输入内容智能提示效果
Dec 02 Javascript
jQuery+JSON实现AJAX二级联动实例分析
Dec 18 Javascript
jquery div模态窗口的简单实例
May 28 Javascript
前端面试题及答案整理(二)
Aug 26 Javascript
原生js实现trigger方法示例代码
May 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
Zend Studio 实用快捷键一览表(精心整理)
2013/08/10 PHP
MongoDB在PHP中的常用操作小结
2014/02/20 PHP
php使用Jpgraph创建3D饼形图效果示例
2017/02/15 PHP
PHP实现的基于单向链表解决约瑟夫环问题示例
2017/09/30 PHP
PDO::errorInfo讲解
2019/01/28 PHP
JavaScript Array扩展实现代码
2009/10/14 Javascript
关闭页面时window.location事件未执行的原因分析及解决方案
2014/09/01 Javascript
.NET微信公众号开发之创建自定义菜单
2015/07/16 Javascript
Node.js读取文件内容示例
2017/03/07 Javascript
vue-quill-editor实现图片上传功能
2017/08/08 Javascript
JS关于刷新页面的相关总结
2018/05/09 Javascript
webuploader实现上传图片到服务器功能
2018/08/16 Javascript
JS常见构造模式实例对比分析
2018/08/27 Javascript
Vue在页面数据渲染完成之后的调用方法
2018/09/11 Javascript
详解vuex状态管理模式
2018/11/01 Javascript
ES6中new Function()语法及应用实例分析
2020/02/19 Javascript
Python 除法小技巧
2008/09/06 Python
PyQt5每天必学之事件与信号
2018/04/20 Python
理想高通滤波实现Python opencv示例
2019/01/30 Python
Python 通过打码平台实现验证码的实现
2019/05/13 Python
python 使用装饰器并记录log的示例代码
2019/07/12 Python
Python换行与不换行的输出实例
2020/02/19 Python
Python 调用有道翻译接口实现翻译
2020/03/02 Python
Python如何实现的二分查找算法
2020/05/27 Python
通过实例了解Python异常处理机制底层实现
2020/07/23 Python
Python如何把字典写入到CSV文件的方法示例
2020/08/23 Python
详解Scrapy Redis入门实战
2020/11/18 Python
python3实现名片管理系统(控制台版)
2020/11/29 Python
matplotlib事件处理基础(事件绑定、事件属性)
2021/02/03 Python
Omio葡萄牙:全欧洲低价大巴、火车和航班搜索和比价
2019/02/09 全球购物
Linux如何修改文件和文件夹的权限
2013/09/05 面试题
新书发布会策划方案
2014/06/09 职场文书
社区个人对照检查材料(群众路线)
2014/09/26 职场文书
2015年暑期社会实践活动总结
2015/03/27 职场文书
该怎么书写道歉信?
2019/07/03 职场文书
浅析CSS在DevTools 中架构演变
2021/10/05 HTML / CSS