JS判断输入字符串长度实例代码(汉字算两个字符,字母数字算一个)


Posted in Javascript onAugust 02, 2016

js判断输入字符串长度实例代码(汉字算两个字符,字母数字算一个)

文本输入时,由于数据库表字段长度限制会导致提交失败,因此想到了此方法验证。

废话不多说上代码:

<html>
<head>
  <title>js判断输入字符串长度(汉字算两个字符,字母数字算一个)</title>
  <style type="text/css">
    .pbt {
      margin-bottom: 10px;
    }

    .ie6 .pbt .ftid a, .ie7 .pbt .ftid a {
      margin-top: 1px;
    }

    .cl:after {
      clear: both;
      content: ".";
      display: block;
      height: 0;
      visibility: hidden;
    }
  </style>
  <script type="text/javascript">
    //获取字符串长度(汉字算两个字符,字母数字算一个)
    function getByteLen(val) {
      var len = 0;
      for (var i = 0; i < val.length; i++) {
        var a = val.charAt(i);
        if (a.match(/[^\x00-\xff]/ig) != null) {
          len += 2;
        }
        else {
          len += 1;
        }
      }
      return len;
    }
    // 只要键盘一抬起就验证编辑框中的文字长度,最大字符长度可以根据需要设定
    function checkLength(obj) {
      var maxChars = 80;//最多字符数   
      var curr = maxChars - getByteLen(obj.value);
      if (curr > 0) {
        document.getElementById("checklen").innerHTML = curr.toString();
      } else {
        document.getElementById("checklen").innerHTML = '0';
        document.getElementById("subject").readOnly = true;
      }
    }
  </script>
</head>
<body>
  <div class="pbt cl">
    <textarea id="subject" maxlength="80" onkeyup="checkLength(this)" accesskey="1" tabindex="11"></textarea>
    <span id="subjectchk">还可输入
    <strong id="checklen" style="color: #FF0000">80</strong>
      个字符
    </span>
    <span id="postNameRule" class="spn_flag_1" style="display: none"></span>
  </div>
</body>
</html>

以上这篇JS判断输入字符串长度实例代码(汉字算两个字符,字母数字算一个)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript实现多个重叠层点击切换效果的方法
Apr 24 Javascript
基于jquery实现图片放大功能
May 07 Javascript
Bootstrap实现弹性搜索框
Jul 11 Javascript
浅谈js常用内置方法和对象
Sep 24 Javascript
12 款 JS 代码测试必备工具(翻译)
Dec 13 Javascript
JavaScript函数节流和函数防抖之间的区别
Feb 15 Javascript
vue2.0使用Sortable.js实现的拖拽功能示例
Feb 21 Javascript
jQuery实现web页面樱花坠落的特效
Jun 01 jQuery
Vue.js的复用组件开发流程完整记录
Nov 29 Javascript
如何能分清npm cnpm npx nvm
Jan 17 Javascript
对node通过fs模块判断文件是否是文件夹的实例讲解
Jun 10 Javascript
浅谈vue生命周期共有几个阶段?分别是什么?
Aug 07 Javascript
基于Vue.js实现数字拼图游戏
Aug 02 #Javascript
js 获取范围内的随机数实例代码
Aug 02 #Javascript
url传递的参数值中包含&amp;时,url自动截断问题的解决方法
Aug 02 #Javascript
AngularJS基础 ng-include 指令示例讲解
Aug 01 #Javascript
基于jQuery实现表格的查看修改删除
Aug 01 #Javascript
jQuery自制提示框tooltip改进版
Aug 01 #Javascript
Three.js学习之文字形状及自定义形状
Aug 01 #Javascript
You might like
PHP仿博客园 个人博客(1) 数据库与界面设计
2013/07/05 PHP
php使用反射插入对象示例分享
2014/03/11 PHP
日常整理PHP中简单的图形处理(经典)
2015/10/26 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
使用js在页面中绘制表格核心代码
2013/09/16 Javascript
JS正则表达式验证数字代码
2014/01/28 Javascript
php基于redis处理session的方法
2016/03/14 Javascript
使用Angular.js开发的注意事项
2016/10/19 Javascript
vue.js初学入门教程(2)
2016/11/07 Javascript
微信小程序-消息提示框实例
2016/11/24 Javascript
Bootstrap CSS布局之列表
2016/12/15 Javascript
jQuery插件Echarts实现的渐变色柱状图
2017/03/23 jQuery
Javascript实现信息滚动效果
2017/05/18 Javascript
Javascript快速实现浏览器系统通知
2017/08/26 Javascript
原生JS与jQuery编写简单选项卡
2017/10/30 jQuery
vue路由嵌套的SPA实现步骤
2017/11/06 Javascript
JavaScript实现全选取消效果
2017/12/14 Javascript
Angular网络请求的封装方法
2018/05/22 Javascript
Angular(5.2-&gt;6.1)升级小结
2018/12/27 Javascript
Vue中CSS动画原理的实现
2019/02/13 Javascript
vue实现手机端省市区区域选择
2019/09/27 Javascript
详解Vue中的watch和computed
2020/11/09 Javascript
[02:52]2017DOTA2国际邀请赛中国区预选赛晋级之路
2017/07/03 DOTA
python中的格式化输出用法总结
2016/07/28 Python
python 基本数据类型占用内存空间大小的实例
2018/06/12 Python
python random从集合中随机选择元素的方法
2019/01/23 Python
详解python中TCP协议中的粘包问题
2019/03/22 Python
python GUI库图形界面开发之PyQt5浏览器控件QWebEngineView详细使用方法
2020/02/26 Python
keras:model.compile损失函数的用法
2020/07/01 Python
澳大利亚领先的睡衣品牌:Peter Alexander
2016/08/16 全球购物
大型营销活动计划书
2014/04/28 职场文书
客户经理竞聘演讲稿
2014/05/15 职场文书
中专毕业生的自荐书
2014/07/01 职场文书
中国文明网向国旗敬礼活动精彩寄语2014
2014/09/27 职场文书
运动员入场词
2015/07/18 职场文书
学校标语口号大全
2015/12/26 职场文书