JS判断字符串字节数并截取长度的方法


Posted in Javascript onMarch 05, 2016

本文实例讲述了JS判断字符串字节数并截取长度的方法。分享给大家供大家参考,具体如下:

这是在项目制作中,积累到的一个东西,感觉效果还可以,现在贴上效果:

JS判断字符串字节数并截取长度的方法

那么,在页面上,我们需要检测两个东西,一个就是字节数,一个就是字符数。

由于数据库中,要求title的长度字节数为200,那么具体的js代码如下:

/*************************************************************************
* CodeBy:SCY CodeDate:2011年3月11日 12:01:16 
* DESC:主要是用来判断当前输入的字节数,以便做到限制输入标题的长度功能
**************************************************************************/
var matchWords;
function notifyTextLength() {
  var inputNum = document.getElementById("txtTitle").value.replace(/[^\x00-\xff]/g, "**").length; //得到输入的字节数
  if (inputNum <= 200) {
    matchWords = document.getElementById("txtTitle").value.length;
    document.getElementById("inputedWord").innerHTML = inputNum + "字节," + matchWords + "字符";
    document.getElementById("inputtingWord").innerHTML = (200 - inputNum) + "字母,"+(Math.round(((200-inputNum)/2)-0.5))+"汉字";
  }
  if (inputNum > 200) {
      document.getElementById("txtTitle").value = document.getElementById("txtTitle").value.substring(0, matchWords); //如果超过200字节,就截取到200字节
    }
}

其中,matchWords代表的是当字节数小于200的情况下,匹配的字符的个数;inputNum则是输入的字节数。

当标题输入的字节数大于200的时候,就按照字符个数进行截取。

html代码如下:

<input id="txtTitle" type="text" class="inputText" runat="server" onpropertychange="notifyTextLength();" />
当前已经输入<span id="inputedWord" style="color:red"></span>
还可以输入<span id="inputtingWord" style="color:Red;"></span>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
提高javascript效率 一次判断,而不要次次判断
Mar 30 Javascript
php析构函数的具体用法小结
Mar 11 Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 语法
Jan 09 Javascript
基于javascript实现图片懒加载
Jan 05 Javascript
JQuery用户名校验的具体实现
Mar 18 Javascript
JS数组实现分类统计实例代码
Sep 30 Javascript
关于layui toolbar和template的结合使用方法
Sep 19 Javascript
24行JavaScript代码实现Redux的方法实例
Nov 17 Javascript
微信小程序swiper使用网络图片不显示问题解决
Dec 13 Javascript
javascript设计模式之装饰者模式
Jan 30 Javascript
动态规划之使用备忘录来改进Javascript函数
Apr 07 Javascript
微信小程序APP的事件绑定以及传递参数时的冒泡和捕获
Apr 19 Javascript
jQuery实现滚动鼠标放大缩小图片的方法(附demo源码下载)
Mar 05 #Javascript
js控制TR的显示隐藏
Mar 04 #Javascript
Node.js操作Firebird数据库教程
Mar 04 #Javascript
实例剖析AngularJS框架中数据的双向绑定运用
Mar 04 #Javascript
node.js微信公众平台开发教程
Mar 04 #Javascript
详解JavaScript的AngularJS框架中的作用域与数据绑定
Mar 04 #Javascript
深入学习AngularJS中数据的双向绑定机制
Mar 04 #Javascript
You might like
PHP学习之正则表达式
2011/04/17 PHP
PHP中的函数-- foreach()的用法详解
2013/06/24 PHP
PHP实现绘制二叉树图形显示功能详解【包括二叉搜索树、平衡树及红黑树】
2017/11/16 PHP
PHP实现的防止跨站和xss攻击代码【来自阿里云】
2018/01/29 PHP
php新建文件的方法实例
2019/09/26 PHP
PHP实现二维数组(或多维数组)转换成一维数组的常见方法总结
2019/12/04 PHP
Jquery AJAX 框架的使用方法
2009/11/03 Javascript
JavaScript利用正则表达式去除日期中的“-”
2014/07/01 Javascript
jquery+json实现分页效果
2016/03/07 Javascript
原生js制作日历控件实例分享
2016/04/06 Javascript
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
2016/12/14 Javascript
在一般处理程序(ashx)中弹出js提示语
2017/08/16 Javascript
Rollup处理并打包JS文件项目实例代码
2018/05/31 Javascript
React 项目迁移 Webpack Babel7的实现
2018/09/12 Javascript
Layui数据表格 前后端json数据接收的方法
2019/09/19 Javascript
浅谈vue中组件绑定事件时是否加.native
2019/11/09 Javascript
python操作excel的方法
2018/08/16 Python
浅谈Pandas:Series和DataFrame间的算术元素
2018/12/22 Python
浅谈Pycharm中的Python Console与Terminal
2019/01/17 Python
ipad上运行python的方法步骤
2019/10/12 Python
NumPy排序的实现
2020/01/21 Python
使用python 计算百分位数实现数据分箱代码
2020/03/03 Python
纯HTML+CSS3制作导航菜单(附源码)
2013/04/24 HTML / CSS
Lacoste(法国鳄鱼)加拿大官网:以标志性的POLO衫而闻名
2019/05/15 全球购物
5.1手机促销活动
2014/01/17 职场文书
法律进社区实施方案
2014/03/21 职场文书
导师评语大全
2014/04/26 职场文书
竞选班干部演讲稿500字
2014/08/20 职场文书
锅炉工岗位职责
2015/02/13 职场文书
试用期辞职信范文
2015/03/02 职场文书
2015年四年级班主任工作总结
2015/10/22 职场文书
导游词之天下银坑景区
2019/11/21 职场文书
纯html+css实现Element loading效果
2021/08/02 HTML / CSS
关于python中模块和重载的问题
2021/11/02 Python
Python采集股票数据并制作可视化柱状图
2022/04/04 Python
pt-archiver 主键自增
2022/04/26 MySQL