脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → JS判断字符串字节数并截取长度

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

 更新时间：2016年03月05日 12:01:24   作者：程序诗人  
这篇文章主要介绍了JS判断字符串字节数并截取长度的方法,涉及JavaScript针对页面元素与字符串的动态操作技巧,需要的朋友可以参考下

本文实例讲述了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动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

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

您可能感兴趣的文章:

相关文章

  • js获取url参数的使用扩展实例

    js获取url参数的使用扩展实例

    js获取参数的具体应用，欢迎加入脚本之家交流群
    2007-12-12
  • SVG实现时钟效果

    SVG实现时钟效果

    这篇文章主要为大家详细介绍了SVG实现时钟效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2018-07-07
  • 浅谈JavaScript的全局变量与局部变量

    浅谈JavaScript的全局变量与局部变量

    下面小编就为大家带来一篇浅谈JavaScript的全局变量与局部变量。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • 详解Howler.js Web音频播放终极解决方案

    详解Howler.js Web音频播放终极解决方案

    这篇文章主要介绍了详解Howler.js Web音频播放终极解决方案,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2020-08-08
  • JS函数基本定义与用法示例

    JS函数基本定义与用法示例

    这篇文章主要介绍了JS函数基本定义与用法,结合实例形式分析了JavaScript函数基本定义、参数、返回值等相关使用技巧,需要的朋友可以参考下
    2020-01-01
  • JS获取当前时间的两种方法小结

    JS获取当前时间的两种方法小结

    这篇文章主要给大家介绍了关于JS获取当前时间的两种方法,在web开发中,通过js获取时间非常的常用,我这里做个总结,需要的朋友可以参考下
    2023-09-09
  • Babel转译失败的常见原因及解决方案

    Babel转译失败的常见原因及解决方案

    Babel是一个JavaScript编译器,用于将现代JavaScript代码转换为兼容旧版浏览器和运行环境的JavaScript代码,然而,在项目中使用Babel进行转译时,有时会遇到转译失败的问题,本文将详细分析Babel转译失败的常见原因,并提供相应的解决方案,需要的朋友可以参考下
    2025-02-02
  • 二行代码解决全部网页木马

    二行代码解决全部网页木马

    还是挂马问题，这段时间，我渐渐感到压力，头大，通过QQ或MSN加我的人越来越多，我最近自己的工作本来就忙得不亦乐乎。哎，想想，还是要抽空来来帮帮大家。
    2008-03-03
  • JS实现倒计时图文效果

    JS实现倒计时图文效果

    这篇文章主要为大家详细介绍了JS实现倒计时图文效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2018-11-11
  • JavaScript练习小项目之修改div块的颜色

    JavaScript练习小项目之修改div块的颜色

    这篇文章主要给大家介绍了关于JavaScript练习小项目之修改div块的颜色的相关资料,文中通过举例介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2023-01-01

最新评论