<!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. 使用 Python 操作 Git 版本库 - GitPython

    GitPython 是一个用于操作 Git 版本库的 python 包, 它提供了一系列的对象模型(库 - Repo.树 - Tree.提交 - Commit等) 用于操作版本库中的相应对象. 版本库 ...

  2. Java问题排查工具单

    前言 平时的工作中经常碰到很多疑难问题的处理,在解决问题的同时,有一些工具起到了相当大的作用,在此书写下来,一是作为笔记,可以让自己后续忘记了可快速翻阅,二是分享,希望看到此文的同学们可以拿出自己日常 ...

  3. 2018牛客多校第六场 G.Pikachu

    题意: 给出一棵n个点的树,每条边有边权.对这个树加边变成一个完全图.新加的边的权值为边上两点在树上的距离.求完全图上任意两点的最大流之和. 题解: 一共有C(n,2)个点对.假设当前求s到t之间的最 ...

  4. mmc驱动的读写过程解析

    mmc io的读写从mmc_queue_thread()的获取queue里面的request开始. 先列出调用栈,看下大概的调用顺序, 下面的内容主要阐述这些函数如何工作. host->ops- ...

  5. React组件通信

    1.父子通信 父 -> 子 props子 -> 父 回调函数,父组件通过props向子组件传递一个函数,子组件调用函数,父组件在回调函数中用setState改变自身状态 2.跨层级通信 1 ...

  6. 我们自己写的solr查询的代码作为search项目中的dao

    我们自己写的solr查询的代码作为search项目中的dao,但是启动时会报错: 其实就是说 searchServiceImpl 中我们 Autowired 的 SearchDao 类 spring ...

  7. [mysql]修改表段默认值

    alter table xxx alter location drop default; alter table xxx alter location set default "xxx&qu ...

  8. apt-get update的hit和ign含义

    How do Ign and Hit affect apt-get update? From what I can see in the apt source code, "Ign" ...

  9. 题解【luogu P2421 bzoj P1407 [NOI2002]荒岛野人】

    洛谷题目链接 bzoj题目链接 题目大意:给定\(n\)组\(C_i, P_i, L_i\),求最小的\(M\)使得对于任意的\(i,j (1 \leq i, j \leq n)\) \[C_i + ...

  10. Tomcat7项目迁移到Tomcat8中文乱码问题

    我打算开始使用Tomcat8了,先解决中文乱码问题,在解决其它的问题! 个人推荐:修改server.xml方式 对于SpringMVC报的错误我稍后在补充问题 1.问题描述 Tomcat 7下项目切换 ...