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 相关文章推荐
网页自动跳转代码收集
Sep 27 Javascript
javascript-表格排序(降序/反序)实现介绍(附图)
May 30 Javascript
JavaScript改变HTML元素的样式改变CSS及元素属性
Nov 12 Javascript
window.showModalDialog()返回值的学习心得总结
Jan 07 Javascript
Javascript基础教程之比较null和undefined值
May 16 Javascript
JavaScript使用键盘输入控制实现数字验证功能
Aug 19 Javascript
微信小程序 图片绝对定位(背景图片)
Apr 05 Javascript
十分钟带你快速了解React16新特性
Nov 10 Javascript
详解Node.js模板引擎Jade入门
Jan 19 Javascript
vue使用代理解决请求跨域问题详解
Jul 24 Javascript
JS用最简单的方法实现四舍五入
Aug 27 Javascript
React实现阿里云OSS上传文件的示例
Aug 10 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
重置版游戏视频
2020/04/09 魔兽争霸
php计算两个日期相差天数的方法
2015/03/14 PHP
smarty模板引擎之分配数据类型
2015/03/30 PHP
PHP 断点续传实例详解
2017/11/11 PHP
Iframe thickbox2.0使用的方法
2009/03/05 Javascript
JQery jstree 大数据量问题解决方法
2010/03/09 Javascript
在JavaScript中获取请求的URL参数
2010/12/22 Javascript
JavaScript XML和string相互转化实现代码
2011/07/04 Javascript
自定义ExtJS控件之下拉树和下拉表格附源码
2013/10/15 Javascript
使用基于Node.js的构建工具Grunt来发布ASP.NET MVC项目
2016/02/15 Javascript
基于BootStrap Metronic开发框架经验小结【八】框架功能总体界面介绍
2016/05/12 Javascript
微信小程序 实现拖拽事件监听实例详解
2016/11/16 Javascript
Angular2平滑升级到Angular4的步骤详解
2017/03/29 Javascript
HTML5+Canvas调用手机拍照功能实现图片上传(上)
2017/04/21 Javascript
vue.extend与vue.component的区别和联系
2018/09/19 Javascript
详解Angular5/Angular6项目如何添加热更新(HMR)功能
2018/10/10 Javascript
Vue 实现手动刷新组件的方法
2019/02/19 Javascript
解决vuex刷新状态初始化的方法实现
2019/08/15 Javascript
python字符串的方法与操作大全
2018/01/30 Python
python使用tcp实现局域网内文件传输
2020/03/20 Python
Django数据库连接丢失问题的解决方法
2018/12/29 Python
python批量创建指定名称的文件夹
2019/03/21 Python
十分钟搞定pandas(入门教程)
2019/06/21 Python
python 中pyqt5 树节点点击实现多窗口切换问题
2019/07/04 Python
python字典的setdefault的巧妙用法
2019/08/07 Python
postman传递当前时间戳实例详解
2019/09/14 Python
python 基于opencv实现图像增强
2020/12/23 Python
布局和排版教程 纯css3实现图片三角形排列
2014/10/17 HTML / CSS
英国领先的办公用品供应商:Viking
2016/08/01 全球购物
ktv总经理岗位职责
2014/02/17 职场文书
投资协议书范本
2014/04/21 职场文书
销售行政专员岗位职责
2014/06/10 职场文书
地道战观后感300字
2015/06/04 职场文书
使用pandas或numpy处理数据中的空值(np.isnan()/pd.isnull())
2021/05/14 Python
Vue vee-validate插件的简单使用
2021/06/22 Vue.js
简单聊一聊SQL注入及防止SQL注入
2022/03/23 MySQL