JQ实现统计文本框剩余字数

效果图:

代码如下,复制即可使用:

<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用JQ实现统计剩余字数</title>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<textarea name="" id="" cols="100" rows="30"></textarea>
<span>你还可以输入<strong style="color:red;">140</strong>个字</span>
<script>
var maxLength = 140;
$('textarea').keyup(function(){
var L = $(this).val().length;
$('strong').text(maxLength-L);//总字数减去输入的字数 if(parseInt($('strong').text())<0){
$('strong').text('0'); //如果输入文字小于0 则文本显示为0
//alert($(this).val());
var val1 = $(this).val().substr(1,140);//截取输入长度
//substr(不推荐使用,ECMAScript没有标准化substr()方法)
$(this).val(val1);
}
})
</script>
</body>
</html>

如果有更好的方法,可以和我们大家一起分享哦,如有错误,欢迎联系我改正,非常感谢!!!

使用JQ实现统计剩余字数的更多相关文章

  1. textarea还剩余字数统计

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

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

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

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

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

  4. JQ限制输入字数,并提示剩余字数

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 如何实现textarea中获取动态剩余字数的实现

    工作中遇到一个案例,之前没有写过,今儿啃了半个下午硬是给写出来,灰常又成就感!当然对于js大牛来说这根本不算啥,但是对于我自己的js能力又向前迈出一小步. 案例介绍:我们常见到有的网站有textare ...

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

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

  7. 文本域textarea显示输入剩余字数

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. PHP 中如何正确统计中文字数

    PHP 中如何正确统计中文字数?这个是困扰我很久的问题,PHP 中有很多函数可以计算字符串的长度,比如下面的例子,分别使用了 strlen,mb_strlen,mb_strwidth 这个三个函数去测 ...

  9. Javascript实现真实字符串剩余字数提示

    //文本框剩余字数提示(字符大小) function textLimitCheckSj(thisArea, maxLength, SpanId) { var str = thisArea.value; ...

随机推荐

  1. 1finally与return、exit()

    public class TestException { public static void main(String[] args) { String[] str = {"1", ...

  2. maven打包 springBoot 工程时,默认识别resources目录,习惯使用 resource 目录的需要手动指定静态资源目录

    最近项目开发,发现springBoot项目在使用maven打包时,我们静态资源文件都放在resource目录下面,大致如下: 在使用maven打包时,发现静态资源没有打进去.原来springBoot默 ...

  3. Enum,Int,String的互相转换

    Enum为枚举提供基类,其基础类型可以是除 Char 外的任何整型.如果没有显式声明基础类型,则使用Int32.编程语言通常提供语法来声明由一组已命名的常数和它们的值组成的枚举. 注意:枚举类型的基类 ...

  4. 从一个简单的 JPA 示例开始

    本文主要讲述 Spring Data JPA,但是为了不至于给 JPA 和 Spring 的初学者造成较大的学习曲线,我们首先从 JPA 开始,简单介绍一个 JPA 示例:接着重构该示例,并引入 Sp ...

  5. Ajax 请求下载 Execl 文件

    通过Ajax请求下载Execl 的问题,掉进一个坑里半个多小时,特此来记录一下 . 起初  我误以为是后台的问题,然而调试了一下并不是这样的,也不会报错,且进入了success 函数. 以下的事件及请 ...

  6. aws rhel 7 安装GUI ,配置VNC

    预计阅读时间:15分钟 预计配置时间:30分钟  (前提是已经申请AWS的EC2的rhel7 云主机并且成功运行) 目前AWS 亚马逊云免费试用一年,申请一个学习使用 痛点:没有GUI,无法搭建Jen ...

  7. [翻译] USING GIT IN XCODE [6] 在XCODE中使用GIT[6]

    USING GIT IN XCODE KEEPING IN SYNC WITH REMOTE REPOSITORIES As you make changes in your local workin ...

  8. svn回退到具体的版本

    svn回退到具体的版本 找到项目的版本号 命令行中输入相关命令  到指定地点找到项目即可

  9. Python入门-模块4(序列化----json模块和pickle模块)

    序列化是指把内存里的数据类型转变成字符串,以使其能存储到硬盘或通过网络传输到远程,因为硬盘或网络传输时只能接受bytes.反之,把硬盘里面的数据读到内存里,叫反序列化.

  10. Linux bzip2命令详解

    Linux bzip/bunzip2命令是.bz2文件的解压缩程序. bunzip2可解压缩.bz2格式的压缩文件.bunzip2实际上是bzip2的符号连接,执行bunzip2与bzip2 -d的效 ...