字数统计功能，原理是给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字数统计的更多相关文章

  1. 工具，如何去掉百度编辑器 ueditor 元素路径、字数统计等

    去掉如下截图: 在百度编辑器 ueditor 根目录下: ueditor.config.js 文件中 搜索并将参数elementPathEnabled设置成false即可 常用功能开关如下: ,ele ...

  2. textarea还剩余字数统计

    <!DOCTYPE html><html><head> <meta charset="utf-8" /> <title> ...

  3. ios开发之--textview意见反馈页面（占位label，字数统计，提交按钮的交互设置）

    记录一个页面的功能: textview的占位符,字数统计,提交按钮的交互设置,具体效果图如下:

  4. HDU1735 字数统计

    版权声明:长风原创 https://blog.csdn.net/u012846486/article/details/28011667 字数统计 Time Limit: 1000/2000 MS (J ...

  5. HDU 1735 字数统计(模拟+一点点贪心的思想）

    题目戳我 字数统计 Time Limit: 1000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total S ...

  6. Hexo添加字数统计、阅读时长

    统计插件 配置 NexT 主题默认已经集成了文章[字数统计].[阅读时长]统计功能,如果我们需要使用,只需要在主题配置文件 _config.yml 中打开 wordcount 统计功能即可.如下所示: ...

  7. 【百度编辑器ueditor】工具，如何去掉百度编辑器 ueditor 元素路径、字数统计等

    去掉如下截图: 在百度编辑器 ueditor 根目录下: ueditor.config.js 文件中 搜索并将参数elementPathEnabled设置成false即可 常用功能开关如下: ,ele ...

  8. textarea还剩余字数统计，支持复制粘贴的时候统计字数

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  9. js 实现textarea剩余字数统计

    1 针对textarea剩余字数统计 2 <div class="fankui-textarea"> 3 <span>留言:</span> &l ...

随机推荐

  1. 国际化支持(I18N)

    本章译者:@nixil 使用国际化支持(I18N)能够使你的应用根据用户所在地区的不同选择不同的语言.下面介绍如何在引用中使用国际化. 只允许使用UTF-8 Play只支持UTF-8一种字符编码.这是 ...

  2. HTML5&CSS3经典动态表格

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. float 和 inline-block的心得

    float 优点: 横向排列时比较方便,不存在浏览器兼容问题. 缺点: 1)多行横向排行时,换行后经常不能顶行显示. 2)浮动后会跳出当前流,造成父元素高度塌陷,解决办法比较成熟统一 ,不存在浏览器兼 ...

  4. iOS 使用AFNetworking遇到错误 Request failed: unacceptable content-type: text/html

    错误日志: Error Domain=com.alamofire.error.serialization.response Code=-1016 "Request failed: unacc ...

  5. 简单代码在ABAP中实现声音的播放

    这段代码的功能是在SAP里面实现声音的播放,可以用作程序提醒功能,和SAP里面’噹噹噹’那个声音的意思差不多.将来在项目中遇到客户想要SAP ABAP发出一点声音的时候就可以参考一下这个程序. REP ...

  6. 如何为基于windows验证的站点的某个页面、文件或文件夹单独设置匿名访问

    在MOSS的项目中,我们经常碰到要单独为基于windows验证的站点的某个页面.文件或文件夹单独设置匿名访问即不登录就可以直接访问.比如说站点的A的某些图片或文件URL存在B站点下的文件夹下.此时访问 ...

  7. Wix安装程序中判断是否安装的.net framwork 4.5

    <PropertyRef Id="NETFRAMEWORK40FULL"/> <PropertyRef Id="NETFRAMEWORK45" ...

  8. Kotlin语法（类和对象）

    二.类和对象: 1. 类定义: 类的声明包含类名,类头(指定类型参数,主构造函数等等),以及类主体,用大括号包裹.类头和类体是可选的:如果没有类体可以省略大括号. class Invoice{ } 2 ...

  9. List集合概述

    上篇总结了Set集合,这回总结下List集合....先来框架图: 一.List集合 List集合代表一个元素有序,可重复的集合,集合中每个元素都有对应的顺序索引.List接口中增加了一些根据索引操作元 ...

  10. Label自适应高度

    每次都逼我翻代码   这次干脆写博客里面算了 哈哈哈 CGSize maxSize = CGSizeMake(ScreenWith-30,NSIntegerMax); CGSize labelsize ...