<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>jQuery实现限制input框  textarea文本框输入字符数量的方法</title>

</head>

<script src="http://j2.58cdn.com.cn/js/jquery-1.8.3.js"></script><!--依赖jquery-->

<body>

用户名:<input type="text" name="username" id="username" >

<span style="display:none;border:0;float:right;margin-right:50px" id="t2" >用户名长度为3-6位</span>

<!--我微信号 (WX-APP-PC) -->

<script>

(function($) {

  $.fn.extend( {

    limiter: function(limit, elem) {

      $(this).on("keyup focus", function() {

        setCount(this, elem);

      });

      function setCount(src, elem) {

        var chars = src.value.length;

        if (chars > limit) {

          src.value = src.value.substr(0, limit);

          chars = limit;

          $('#t2').show();

        }else{

            $('#t2').hide();

        }

        elem.html( limit - chars );

      }

      setCount($(this)[0], elem);

    }

  });

})(jQuery);

//To setup the limiter, simply include a call similar to the one below:

var elem = $("#username");

$("#username").limiter(6, elem);

</script>

</body>

</html>

jQuery实现限制input框 textarea文本框输入字符数量的方法的更多相关文章

  1. Jquery实现 TextArea 文本框根据输入内容自动适应高度

    原文 Jquery实现 TextArea 文本框根据输入内容自动适应高度 在玩微博的时候我们可能会注意到一个细节就是不管是新浪微博还是腾讯微博在转发和评论的时候给你的默认文本框的高度都不会很高,这可能 ...

  2. 如何限制textarea文本框的输入字数

    代码实例如下: <!doctype html><html><head><meta charset="UTF-8"><title ...

  3. 【kindeditor】KindEditor获取多个textarea文本框的值并判断非空

    kindeditor官网:http://kindeditor.net/demo.php 如何获取多个KindEditor中textarea文本框的值,方式很多种(带有HTML标签). var intr ...

  4. html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。

    关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="s ...

  5. IE input X 去掉文本框的叉叉和password输入框的眼睛图标

    IE input X 去掉文本框的叉叉和password输入框的眼睛图标 从IE 10開始,type="text" 的 input 在用户输入内容后.会自己主动产生一个小叉叉(X) ...

  6. 限制textarea 文本框的长度(收集了几个办法)

    文章参考地址:http://blog.csdn.net/nhconch/article/details/4223076 需求背景: 前几天,因为客户有一个需求说,需要对一个评论(一个textarea文 ...

  7. textarea中限制输入字符长度

    要在textarea中限制输入字符的长度,比如在twitter中要限制字符为140个,可实现的方法有: 1. <textarea name="A" cols="45 ...

  8. jquery禁用form表单中的文本框

    //禁用form表单中所有的input[文本框.复选框.单选框],select[下拉选],多行文本框[textarea] function disableForm(formId, isDisabled ...

  9. jquery ui autocomplete 实现点击文本框，出现所有查询信息效果,与bootstrap结合使用修改样式

    直接看代码 <!doctype html> <html lang="en"> <head> <meta charset="utf ...

随机推荐

  1. Mongo 常用操作

    1.查询 [基本形式]db.col.find().pretty():pretty() 方法以格式化的方式来显示所有文档. [获取记录条数]:db.users.find().count(); [读取指定 ...

  2. linux下安装EJBCA 搭建私有CA服务器

    linux下安装EJBCA 搭建私有CA服务器 EJBCA是一个全功能的JAVA的CA系统软件,我们可以用此搭建私有CA服务器: 一:首先我的测试环境: 1.  linux mint18.3 62位: ...

  3. 通过Nginx反向代理之后客户端验证码session不一致造成无法验证通过的问题解决

    location / { proxy_pass http://127.0.0.1:9080/app/; proxy_cookie_path /app/ /; proxy_cookie_path /ap ...

  4. android自己定义控件之飞入飞出控件

    近期呢,本人辞职了.在找工作期间.不幸碰到了这个求职淡季,另外还是大学生毕业求职的高峰期,简历发了无数份却都石沉大海.宝宝心里那是一个苦啊! 翻着过去的代码,本人偶然找到了一个有意思的控件.那时本人还 ...

  5. Java中Lambda表达式的使用（转）

    https://www.cnblogs.com/franson-2016/p/5593080.html 简介(译者注:虽然看着很先进,其实Lambda表达式的本质只是一个"语法糖" ...

  6. 自己定义ViewGroup实现仿淘宝的商品详情页

    近期公司在新版本号上有一个须要. 要在首页加入一个滑动效果, 详细就是仿照X宝的商品详情页, 拉到页面底部时有一个粘滞效果, 例如以下图 X东的商品详情页,假设用户继续向上拉的话就进入商品图文描写叙述 ...

  7. 记一次免费让网站启用HTTPS的过程

    写在前面 个人网站运行将近2个月了,期间根据酷壳的一篇教程如何免费的让网站启用HTTPS做了一次,中间遇到问题就放下了.昨天孙三苗问我网站地址说要添加友链,出于好奇想看他网站长什么样,顺道也加一下友链 ...

  8. 突破这个四个阶段年薪没有50W，还好意思说是搞Java的？

    该视频教程总共分为四个阶段来学习.逐步进阶,并且还会不定期更新.我简介一下每一个阶段的视频资源,学习顺序不分先后. 第一阶段 第一阶段主要从 svn/git 版本号控制.Java高并发.JVM虚拟机. ...

  9. 值得从PHP转向JavaScript

    1.掌握一门语言而成为爆栈工程师确实诱惑力极大 2.JavaScript 代码的语义性比 PHP 更强一些,当然语言整体特性也复杂不少,学习成本是更高的 3.JSON原生:配合MongoDB的话,从头 ...

  10. 刷机补丁包updater-script脚本

    1.单刷补丁包 新建META-INF文件夹,新建txt文件命名为:updater-script新建system文件夹,在里面新建app文件夹,把你要单刷的apk放进app文件夹在updater-scr ...