效果:

html代码:

<textarea id="assayInfo" name="assayInfo" rows="3" cols="34" maxlength="30" placeholder="提示:请输入检查结果等相关信息,最多30个汉字"></textarea>
<span id="wordCount">30</span>/30

jquery代码:

$(document).ready(function() {
var counter = $("#assayInfo").val().length; //获取文本域的字符串长度
$("#wordCount").text(30 - counter);
$(document).keyup(function() {
var text = $("#assayInfo").val();
var counter = text.length;
$("#wordCount").text(30 - counter); //每次减去字符长度
}); });

jquery textarea输入字符字数提示的更多相关文章

  1. jquery实现显示textarea输入字符数

    起初会想到使用keyup.keydown.keypress或者是onchange事件,onchange需要失去焦点才触发, 其它三个有些对按住键盘某个键不放不生效,有些对使用中文输入法正在输入时统计不 ...

  2. textarea输入字符有限制

    function limitedNumberOfInputCharacters(limitedNumber, string){ var strLength = 0; if(string !== nul ...

  3. textarea限定字数提示效果

    最近工作中要实现的一个效果是:在textarea中输入字符会提示剩余多少字符可输入.于是马不停蹄的开始查阅资料. HTML代码: <table> <colgroup> < ...

  4. js动态显示可输入字数并提示还可以输入的字数

    动态显示可输入的字数提示还可以输入的字数. 代码: <input name="title" type="text" size="50" ...

  5. vue使用textare如何正确统计输入字符个数

    最近vue做微信公众号的开发,使用weui的textarea输入限制字数(官网例子),并且显示.代码如下:再安卓和电脑都没有问题,但是ios输入的时候,显示字数不正确, 但是输入之后删除其中一个,就可 ...

  6. chrome浏览器下禁制 textarea改变大小; Jquery的textareaCounter插件控制textarea输入的字符数量

    给  textarea 添加一个css 样式即可 resize: none;   用Jquery的插件控制textarea输入的字符数量 一:引用Jquery脚本,并引入 textareaCounte ...

  7. jQuery实现限制input框 textarea文本框输入字符数量的方法

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

  8. jquery插件:textarea的字数提示、textBox的文字提示

    引用文件:    <script src=”/TextTip/TextTip.js” type=”text/javascript”></script> 一.textarea的字 ...

  9. JS实现动态提示文本框可输入剩余字数(类似发表微博数字提示)

    一.实现效果: 为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,项目中需要通过判断提示文本框剩余可输入字数. html & JS: <div> <textare ...

随机推荐

  1. context-param与init-param的区别与作用

    <context-param>的作用: web.xml的配置中<context-param>配置作用 1. 启动一个WEB项目的时候,容器(如:Tomcat)会去读它的配置文件 ...

  2. Chapter 1 First Sight——10

    Instead, I was ivory-skinned, without even the excuse of blue eyes or red hair, despite the constant ...

  3. Application对象

    Application对象报讯是应用程序参数的额,多个用户可以共享一个Application.用于启动和管理ASP.NET应用程序. Count  属性 获取Application对象变量的个数,集合 ...

  4. Ubuntu系统如何修改主机名

    1.执行命令 hostname temp_name 这样主机名就改掉了.只不过重启后名字会恢复不一定使我们想要的.机器重启后会重新去读取/etc/hostname里面存储的主机名.所以如果想永久改掉的 ...

  5. CodeForces 158B Taxi(贪心)

    贪心,注意优先级,4单独,3与1先匹配,2与2匹配(注意判断2有没有剩下),然后2与两个1匹配,最后4个1匹配就可以了. #include<iostream> #include<cs ...

  6. Express静态服务器

    做应用的时候,如果需要给人测试,需要搭建本地服务器: 下载apache tomcat,各种配置,复杂得很. 之前在网上找到python的实现,在文件夹内运行一行代码就可以了,但是可惜,本机访问都很慢. ...

  7. 比较好的前端方法库及一些vue如何引入静态文件

    https://select2.github.io/examples.html   select2 自动搜索带select选择 ## 表单提交 https://github.com/marioizqu ...

  8. JOptionPane的使用

    最近在做swing程序中遇到使用消息提示框的,JOptionPane类其中封装了很多的方法. 很方便的,于是就简单的整理了一下. 1.1 showMessageDialog 显示一个带有OK 按钮的模 ...

  9. python+django+bootstrap

    python install django 置环境变量,将这个目录添加到系统环境变量中: C:\Python36\Lib\site-packages\django\ cmd下测试: 1.输入pytho ...

  10. Charles从入门到精通

    Charles 从入门到精通 发表于 2015-11-14 12:00 文章目录 1. 目录 2. 简介 3. 安装 Charles 4. 将 Charles 设置成系统代理 5. Charles 主 ...