JS实现区分中英文并统计字符个数的方法示例


Posted in Javascript onJune 09, 2018

本文实例讲述了JS实现区分中英文并统计字符个数的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>js区分中英文统计字符个数</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel=" rel="external nofollow" stylesheet">
</head>
<body>
  <input type="text" value="" id="str"><span id="showcontent"></span><!-- 此处原来使用的label标签,但是设置其innerHTML的值在ie8上报错,故换为span标签 -->
  <script type="text/javascript">
  var countnums=(function(){
    var trim=function(strings){
      return (strings||"").replace(/^(\s|\u00A0)+|(\s|\u00A0)+$/g,"");//+表示匹配一次或多次,|表示或者,\s和\u00A0匹配空白字符,/^以……开头,$以……结尾,/g全局匹配,/i忽略大小写
    }
    return function(_str){
      _str=trim(_str);  //去除字符串的左右两边空格
      var strlength=_str.length;
      if(!strlength){  //如果字符串长度为零,返回零
        return 0;
      }
      var chinese=_str.match(/[\u4e00-\u9fa5]/g); //匹配中文,match返回包含中文的数组
      return strlength+(chinese?chinese.length:0); //计算字符个数
    }
  })();
  function count(tThis){
    var charnum=countnums(tThis.value)
      var showid=document.getElementById("showcontent");
      showid.innerHTML="您总共输入了"+charnum+"个字符";
  }
  window.onload=function(){
    var str=document.getElementById("str");
    str.onkeypress=function(){
      count(this);
    }
    str.onkeyup=function(){
      count(this);
    }
  }
  </script>
</body>
</html>

使用在线HTML/CSS/JavaScript代码运行工具 http://tools.3water.com/code/HtmlJsRun测试后运行结果如下:

JS实现区分中英文并统计字符个数的方法示例

Javascript 相关文章推荐
javascript dom代码应用 简单的相册[firefox only]
Jun 12 Javascript
jQuery中调用WebService方法小结
Mar 28 Javascript
node.js中的http.get方法使用说明
Dec 14 Javascript
jQuery使用removeClass方法删除元素指定Class的方法
Mar 26 Javascript
JavaScript将当前时间转换成UTC标准时间的方法
Apr 06 Javascript
javascript 中的 delete及delete运算符
Nov 15 Javascript
javascript作用域、作用域链(菜鸟必看)
Jun 16 Javascript
BootStrap网页中代码显示用法详解
Oct 21 Javascript
Angular实现模版驱动表单的自定义校验功能(密码确认为例)
May 17 Javascript
vue中axios的封装问题(简易版拦截,get,post)
Jun 15 Javascript
解决vue 单文件组件中样式加载问题
Apr 24 Javascript
关于JavaScript轮播图的实现
Nov 20 Javascript
详解angular脏检查原理及伪代码实现
Jun 08 #Javascript
解析vue路由异步组件和懒加载案例
Jun 08 #Javascript
node中modules.exports与exports导出的区别
Jun 08 #Javascript
Vue不能观察到数组length的变化
Jun 08 #Javascript
Node.js中的child_process模块详解
Jun 08 #Javascript
详解使用 Node.js 开发简单的脚手架工具
Jun 08 #Javascript
使用JavaScript生成罗马字符的实例代码
Jun 08 #Javascript
You might like
php curl 登录163邮箱并抓取邮箱好友列表的代码(经测试)
2011/04/07 PHP
windows服务器中检测PHP SSL是否开启以及开启SSL的方法
2014/04/25 PHP
php上传中文文件名乱码问题处理方案
2015/02/03 PHP
详解PHP中的mb_detect_encoding函数使用方法
2015/08/18 PHP
laravel框架中路由设置,路由参数和路由命名实例分析
2019/11/23 PHP
图片完美缩放
2006/09/07 Javascript
深入认识JavaScript中的函数
2007/01/22 Javascript
IE FF OPERA都可用的弹出层实现代码
2009/09/29 Javascript
JavaScript高级程序设计(第3版)学习笔记11 内建js对象
2012/10/11 Javascript
node.js中的socket.io的广播消息
2014/12/15 Javascript
JavaScript中的getTime()方法使用详解
2015/06/10 Javascript
举例讲解如何判断JavaScript中对象的类型
2016/04/22 Javascript
简单实现JS计算器功能
2016/12/21 Javascript
详解handlebars+require基本使用方法
2016/12/21 Javascript
JS中append字符串包含onclick无效传递参数失败的解决方案
2016/12/26 Javascript
jquery实现的table排序功能示例
2017/03/10 Javascript
在 Angular中 使用 Lodash 的方法
2018/02/11 Javascript
详解vue axios二次封装
2018/07/22 Javascript
详解Vue.js v-for不支持IE9的解决方法
2018/12/29 Javascript
node.js Promise对象的使用方法实例分析
2019/12/26 Javascript
Vuex模块化应用实践示例
2020/02/03 Javascript
element-ui和vue表单(对话框)验证提示语(残留)清除操作
2020/09/11 Javascript
python使用pil生成图片验证码的方法
2015/05/08 Python
详解详解Python中writelines()方法的使用
2015/05/25 Python
Python中方法链的使用方法
2016/02/23 Python
Python八大常见排序算法定义、实现及时间消耗效率分析
2018/04/27 Python
基于数据归一化以及Python实现方式
2018/07/11 Python
Python实现的字典排序操作示例【按键名key与键值value排序】
2018/12/21 Python
Python-Tkinter Text输入内容在界面显示的实例
2019/07/12 Python
学习雷锋寄语大全
2014/04/11 职场文书
2014年会计主管工作总结
2014/12/20 职场文书
承诺书范本
2015/01/21 职场文书
网聊搭讪开场白
2015/05/28 职场文书
个人自我鉴定怎么写?
2019/07/01 职场文书
pytorch 运行一段时间后出现GPU OOM的问题
2021/06/02 Python
详解Python中的进程和线程
2021/06/23 Python