<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<script src="js/jquery-1.10.2.js" type="text/javascript" charset="utf-8"></script>

</head>

<body>

<!-- 在处理textarea之前，首先需知道textarea是不会显示value值的，

如果想显示需要使用js中的方法 $('#textArea').val('123'); -->

<div class="one">

<textarea id="textArea" cols="30" rows="10">测试</textarea>

<span class='two'><span id="textNum">0</span>/100</span>

<!-- 最多100字符，0处显示的是已经写了多少字符 -->

</div>

<script>

$('#textArea').on("keyup",function(){

$('#textNum').text($('#textArea').val().length);//这句是在键盘按下时，实时的显示字数

if($('#textArea').val().length > 100){

$('#textNum').text(100);//长度大于100时0处显示的也只是100

$('#textArea').val($('#textArea').val().substring(0,100));//长度大于100时截取钱100个字符

}

})

$('#textNum').text($('#textArea').val().length);//这句是在刷新的时候仍然显示字数

</script>

</body>

</html>

js 实时显示字数的更多相关文章

  1. php随笔6-thinkphp OA系统 JS 实时显示当前时间

    不多说,直入主题: JS. // JavaScript Document function showtime() { var today,hour,second,minute,year,month,d ...

  2. js实时显示系统时间

    刚刚在做后台页面最上面要动态显示时间刚写了这个代码 将这段代码加入<head></head> <!--时间显示代码 --><script>functio ...

  3. js实时显示鼠标坐标

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

  4. input、textArea实时显示剩余可输入的字数

    <h2>实时显示剩余可输入的字数(字母,数字,中文都算一个字)</h2> <h>昵称:</h> <div> <input type=& ...

  5. 使用Uploadify实现上传图片生成缩略图例子,实时显示进度条

    不了解Uploadify的,先看看前一篇详细说明 http://www.cnblogs.com/XuebinDing/archive/2012/04/26/2470995.html Uploadify ...

  6. jquery+ajax 实现text框模糊搜索并可利用listbox实时显示模糊搜索列表结果

    功能描述: text框中输入,text框下面的listbox中实时显示依据输入的内容进行模糊搜索的结果 js代码 $j(function() { $j("input[id='txtCos'] ...

  7. 实时显示数据 SignalR 及时消息提醒（ 立即向其推送内容）

    实时显示数据  SignalR 及时消息提醒( 立即向其推送内容) http://www.cnblogs.com/Leo_wl/p/5634910.html  <!--Reference the ...

  8. AngularJS判断checkbox/复选框是否选中并实时显示

    最近做了一个选择标签的功能,把一些标签展示给用户,用户选择自己喜欢的标签,就类似我们在购物网站看到的那种过滤标签似的: 简单的效果如图所示: 首先看一下html代码: 1 <!DOCTYPE h ...

  9. python websocket网页实时显示远程服务器日志信息

    功能:用websocket技术,在运维工具的浏览器上实时显示远程服务器上的日志信息 一般我们在运维工具部署环境的时候,需要实时展现部署过程中的信息,或者在浏览器中实时显示程序日志给开发人员看.你还在用 ...

随机推荐

  1. Shel脚本学习—反引号、单引号、双引号区别与联系

    反引号 反引号位 (`) 位于键盘的Tab键的上方.1键的左方.注意与单引号(')位于Enter键的左方的区别. 在Linux中起着命令替换的作用.命令替换是指shell能够将一个命令的标准输出插在一 ...

  2. P1365 WJMZBMR打osu! / Easy

    题目背景 原 维护队列 参见P1903 题目描述 某一天WJMZBMR在打osu~~~但是他太弱逼了,有些地方完全靠运气:( 我们来简化一下这个游戏的规则 有 nnn 次点击要做,成功了就是o,失败了 ...

  3. 详解 ES6 Modules

    详解 ES6 Modules 对于新人朋友来说,想要自己去搞定一个ES6开发环境并不是一件容易的事情,因为构建工具的学习本身又是一个非常大的方向,我们需要花费不少的时间才能掌握它. 好在慢慢的开始有大 ...

  4. hadoop SequenceFile示例

    1.写入,SequenceFile的key和value不一定是Writable,只要能被Serialization序列化和反序列化就可以. private static final String[] ...

  5. 运行Jar包程序Shell

    启动: #!/bin/bash set -e JAVA_HOME=/usr/local/java# 检查是否有项目名 appName=$ if [ "$appName" == &q ...

  6. call和apply第一个参数为null/undefined，函数this指向全局对象

    call和apply第一个参数为null/undefined,函数this指向全局对象,在浏览器中是window,在node中是global 在严格模式中(ie 6/7/8/9 除外),传入null/ ...

  7. 【算法】【网络流24题】巨坑待填（成功TJ，有时间再填）

    ------------------------------------------------------------------------------------ 17/24 --------- ...

  8. bzoj3232

    Description DZY家的后院有一块地,由N行M列的方格组成,格子内种的菜有一定的价值,并且每一条单位长度的格线有一定的费用. DZY喜欢在地里散步.他总是从任意一个格点出发,沿着格线行走直到 ...

  9. JavaScript数据类型转换方法汇总

    转换为布尔型 用两次非运算(!): 1 !!5 ==> true 用布尔型的构造函数: 1 new Boolean(5) == > true 值转换为布尔类型为false:0,+0,-0, ...

  10. memchr函数

    函数原型:extern void *memchr(void *str, char ch, unsigned count) 参数说明:从str所指内存区域的前count个字节查找字符ch.        ...