Javascript实现字数统计


Posted in Javascript onJuly 03, 2015

字数统计功能,原理是给textarea添加onKeyup事件,事件读取textarea内容并获得长度,并赋值给统计字数的那个文本节点,这里有一点要注意的是添加onKeypress和onKeydown事件也能实现效果,但都有些不足,会在某些情况下造成误解,我都试了下,感觉只用一个onKeyup事件是最明智的选择。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试文件</title>
<script>
function cal_words(){
  var length = document.getElementById("test").value.length;
  document.getElementById("num").innerHTML = length;
}
</script>
</head>

<body>
<div class="reply">
 <textarea id="test" onKeyUp="cal_words()"></textarea>
 <div>字数:<span id="num">0</span></div>
</div>
</body>
</html>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
记录几个javascript有关的小细节
Apr 02 Javascript
jQuery Ajax使用实例
Apr 16 Javascript
浅析JavaScript中的对象类型Object
May 26 Javascript
使用vue制作FullPage页面滚动效果
Aug 21 Javascript
Vue实现购物车场景下的应用
Nov 27 Javascript
vue 路由页面之间实现用手指进行滑动的方法
Feb 23 Javascript
浅谈vue限制文本框输入数字的正确姿势
Sep 02 Javascript
浅谈vue3中effect与computed的亲密关系
Oct 10 Javascript
JavaScript简易计算器制作
Jan 17 Javascript
JS 设计模式之:工厂模式定义与实现方法浅析
May 06 Javascript
ES6 async、await的基本使用方法示例
Jun 06 Javascript
原生小程序封装跑马灯效果
Oct 21 Javascript
JavaScript获取表格(table)当前行的值、删除行、增加行
Jul 03 #Javascript
jQuery中 delegate使用的问题
Jul 03 #Javascript
JavaScript实现select添加option
Jul 03 #Javascript
JavaScript定时器和优化的取消定时器方法
Jul 03 #Javascript
Javascript中的作用域和上下文深入理解
Jul 03 #Javascript
JavaScript访问字符串中单个字符的两种方法
Jul 03 #Javascript
JavaScript中解析JSON数据的三种方法
Jul 03 #Javascript
You might like
mac下使用brew配置环境的步骤分享
2011/05/23 PHP
使用PHP导出Word文档的原理和实例
2013/10/21 PHP
php获取汉字首字母的函数
2013/11/07 PHP
对PHP新手的一些建议(PHP学习经验总结)
2014/08/20 PHP
php each 返回数组中当前的键值对并将数组指针向前移动一步实例
2016/11/22 PHP
PHP实现按之字形顺序打印二叉树的方法
2018/01/16 PHP
jQuery EasyUI API 中文文档 - MenuButton菜单按钮使用介绍
2011/10/06 Javascript
简单谈谈javascript代码复用模式
2015/01/28 Javascript
swtich/if...else的替代语句
2015/08/16 Javascript
推荐10 个很棒的 jQuery 特效代码
2015/10/04 Javascript
vue2的todolist入门小项目的详细解析
2017/05/11 Javascript
详解Angular路由 ng-route和ui-router的区别
2017/05/22 Javascript
redux中间件之redux-thunk的具体使用
2018/04/17 Javascript
Angular 封装并发布组件的方法示例
2018/04/19 Javascript
浅谈node中的cluster集群
2018/06/02 Javascript
vue 引用自定义ttf、otf、在线字体的方法
2019/05/09 Javascript
node命令行工具之实现项目工程自动初始化的标准流程
2019/08/12 Javascript
微信小程序实现星级评价
2019/11/20 Javascript
Vue为什么要谨慎使用$attrs与$listeners
2020/08/27 Javascript
vue3.0自定义指令(drectives)知识点总结
2020/12/27 Vue.js
[01:12:08]LGD vs OG 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.24
2019/09/10 DOTA
浅析Python中的for 循环
2016/06/09 Python
Python实现将SQLite中的数据直接输出为CVS的方法示例
2017/07/13 Python
python实现上传下载文件功能
2020/11/19 Python
基于Python中numpy数组的合并实例讲解
2018/04/04 Python
python+selenium打印当前页面的titl和url方法
2018/06/22 Python
python实现文件的备份流程详解
2019/06/18 Python
python实现本地批量ping多个IP的方法示例
2019/08/07 Python
python实现京东订单推送到测试环境,提供便利操作示例
2019/08/09 Python
Python3+Selenium+Chrome实现自动填写WPS表单
2020/02/12 Python
Python如何将图像音视频等资源文件隐藏在代码中(小技巧)
2020/02/16 Python
工厂实习感言
2014/01/14 职场文书
家长会邀请书
2014/01/25 职场文书
房产继承公证书
2014/04/09 职场文书
大专学生求职信
2014/07/04 职场文书
Python开发五子棋小游戏
2022/04/28 Python