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 学习笔记(十三)Dom创建表格
Jan 21 Javascript
JQuery 获取和设置Select选项的代码
Feb 07 Javascript
javascript onmouseout 解决办法
Jul 17 Javascript
js移除事件 js绑定事件实例应用
Nov 28 Javascript
node.js express安装及示例网站搭建方法(分享)
Aug 22 Javascript
jQuery编写设置和获取颜色的插件
Jan 09 Javascript
Html5 js实现手风琴效果
Apr 17 Javascript
泛谈JS逻辑判断选择器 || &amp;&amp;
May 24 Javascript
javascript数组元素删除方法delete和splice解析
Dec 09 Javascript
JS+CSS+HTML实现“代码雨”类似黑客帝国文字下落效果
Mar 17 Javascript
sharp.js安装过程中遇到的问题总结
Apr 02 Javascript
解决vue做详情页跳转的时候使用created方法 数据不会更新问题
Jul 24 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
基于curl数据采集之单页面并行采集函数get_htmls的使用
2013/04/28 PHP
thinkphp判断访客为手机端或PC端的方法
2014/11/24 PHP
基于php实现七牛抓取远程图片
2015/12/01 PHP
PHP读取PPT文件的方法
2015/12/10 PHP
利用php-cli和任务计划实现刷新token功能的方法
2017/05/03 PHP
老生常谈PHP中的数据结构:DS扩展
2017/07/17 PHP
PDO::_construct讲解
2019/01/27 PHP
使用laravel和ajax实现整个页面无刷新的操作方法
2019/10/03 PHP
ExtJs的Date格式字符代码
2010/12/30 Javascript
js 数组去重的四种实用方法
2014/09/09 Javascript
Javascript的无new构建实例详解
2016/05/15 Javascript
JavaScript实现的仿新浪微博原生态输入字数即时检查功能【兼容IE6】
2017/09/26 Javascript
微信小程序实现手指触摸画板
2018/07/09 Javascript
vue中如何去掉空格的方法实现
2018/11/09 Javascript
基于vue.js实现分页查询功能
2018/12/29 Javascript
原生js实现each方法实例代码详解
2019/05/27 Javascript
Vue开发环境跨域访问问题
2020/01/22 Javascript
vue+vant实现购物车全选和反选功能
2020/11/17 Vue.js
[39:19]完美世界DOTA2联赛PWL S2 SZ vs LBZS 第二场 11.26
2020/11/30 DOTA
python备份文件以及mysql数据库的脚本代码
2013/06/10 Python
Python中的特殊语法:filter、map、reduce、lambda介绍
2015/04/14 Python
Python中函数及默认参数的定义与调用操作实例分析
2017/07/25 Python
scrapy spider的几种爬取方式实例代码
2018/01/25 Python
python实现将文件夹内的每张图片批量分割成多张
2019/07/22 Python
python飞机大战pygame碰撞检测实现方法分析
2019/12/17 Python
pycharm实现print输出保存到txt文件
2020/06/01 Python
keras 解决加载lstm+crf模型出错的问题
2020/06/10 Python
PyCharm 光标变成黑块的解决方式
2021/02/06 Python
iHerb俄罗斯:维生素、补品和天然产品
2020/07/09 全球购物
大三预备党员入党思想汇报
2014/01/08 职场文书
电脑饰品店的创业计划书
2014/01/21 职场文书
生产部岗位职责范文
2014/02/07 职场文书
高中竞选班长演讲稿
2014/04/24 职场文书
初中学校对照检查材料
2014/08/19 职场文书
Nginx location 和 proxy_pass路径配置问题小结
2021/09/04 Servers
PostgreSQL13基于流复制搭建后备服务器的方法
2022/01/18 PostgreSQL