编程 Javascript

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测试后运行结果如下：

- Author -

前端爱我

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

jQuery 使用手册(六)

Sep 23 Javascript

YUI的Tab切换实现代码

Apr 11 Javascript

javascript下高性能字符串连接StringBuffer类

Aug 16 Javascript

jquery操作select元素和option的实例代码

Feb 03 Javascript

一道关于JavaScript变量作用域的面试题

Mar 08 Javascript

JS作用域链详解

Jun 26 Javascript

JS+canvas实现的五子棋游戏【人机大战版】

Jul 19 Javascript

AngularJS实现controller控制器间共享数据的方法示例

Oct 30 Javascript

Vue 项目部署到服务器的问题解决方法

Dec 05 Javascript

基于VUE移动音乐WEBAPP跨域请求失败的解决方法

Jan 16 Javascript

layer页面跳转,获取html子节点元素的值方法

Sep 27 Javascript

node.js 如何监视文件变化

Sep 01 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