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 相关文章推荐
js常用函数 不错
Sep 08 Javascript
使javascript也能包含文件
Oct 26 Javascript
JavaScript中数组的排序、乱序和搜索实现代码
Nov 30 Javascript
jQuery 借助插件Lavalamp实现导航条动态美化效果
Sep 27 Javascript
js库Modernizr的介绍和使用
May 07 Javascript
详解vue2.0 使用动态组件实现 Tab 标签页切换效果(vue-cli)
Aug 30 Javascript
微信小程序使用input组件实现密码框功能【附源码下载】
Dec 11 Javascript
浅谈vue项目如何打包扔向服务器
May 08 Javascript
Angular动态绑定样式及改变UI框架样式的方法小结
Sep 03 Javascript
移动端图片上传旋转、压缩问题的方法
Oct 16 Javascript
微信小程序实现按字母排列选择城市功能
Nov 25 Javascript
基于Vue的侧边目录组件的实现
Feb 05 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
PHPLog php 程序调试追踪工具
2009/09/09 PHP
javascript中运用闭包和自执行函数解决大量的全局变量问题
2010/12/30 Javascript
js 弹出菜单/窗口效果
2011/10/30 Javascript
jQuery对Select的操作大集合(收藏)
2013/12/28 Javascript
JavaScript包装对象使用详解
2015/07/09 Javascript
浅谈Nodejs观察者模式
2015/10/13 NodeJs
轻松学习jQuery插件EasyUI EasyUI创建CRUD应用
2015/11/30 Javascript
js html5 css俄罗斯方块游戏再现
2016/10/17 Javascript
JS闭包与延迟求值用法示例
2016/12/22 Javascript
javascript容错处理代码(屏蔽js错误)
2017/01/20 Javascript
JavaScript的六种继承方式(推荐)
2017/06/26 Javascript
简单实现js轮播图效果
2017/07/14 Javascript
浅谈基于Vue.js的移动组件库cube-ui
2017/12/20 Javascript
JavaScript获取移动设备型号的实现代码(JS获取手机型号和系统)
2018/03/10 Javascript
详解项目升级到vue-cli3的正确姿势
2019/01/28 Javascript
vue 移动端记录页面浏览位置的方法
2020/03/11 Javascript
[41:37]DOTA2北京网鱼队选拔赛——冲击职业之路
2015/04/13 DOTA
python实现kMeans算法
2017/12/21 Python
对python3 中方法各种参数和返回值详解
2018/12/15 Python
python安装pil库方法及代码
2019/06/25 Python
Python中一个for循环循环多个变量的示例
2019/07/16 Python
django2笔记之路由path语法的实现
2019/07/17 Python
python3用PyPDF2解析pdf文件,用正则匹配数据方式
2020/05/12 Python
德国价格合理的品牌商品购物网站:averdo
2019/03/21 全球购物
写一个方法1000的阶乘
2012/11/21 面试题
生产主管岗位职责
2013/11/10 职场文书
大学生个人简历自我评价
2013/11/16 职场文书
给幼儿园老师的表扬信
2014/01/19 职场文书
工作求职自荐信
2014/06/13 职场文书
路政管理求职信
2014/06/18 职场文书
税务职业生涯规划书范文
2014/09/16 职场文书
开展党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
一年级小学生评语大全
2014/12/25 职场文书
治庸问责工作总结
2015/08/11 职场文书
反四风问题学习心得体会
2016/01/22 职场文书
叶县这家生产军用电台的兵工厂,人称“四机部”,走出一上将
2022/02/18 无线电