1.导入外部.js文件：

 <script src="js/jquery-1.8.3.js" type="text/javascript"></script>

2.在<body>标签中加入如下代码：

<body>

        还可以输入<span id="word">140</span>个字<br />

       <textarea id="txt" name="" cols="" rows=""></textarea>

       <script language="javascript" type="text/javascript">

           $("#txt").keyup(function(){

               if($("#txt").val().length > 140){

                   $("#txt").val( $("#txt").val().substring(0,140) );

               }

               $("#word").text( 140 - $("#txt").val().length ) ;

            });

       </script>

</body>

3.如果页面加载时输入框中有默认文本，那么要在页面加载时运行如下jQuery代码，方能正确显示：

$("#word").text( 140 - $("#txt").val().length ) ;

用jQuery实现限制输入字数的文本框的更多相关文章

  1. jquery插件artTxtCount输入字数限制,并提示剩余字数

    工作中用到,需要批量处理下 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...

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

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

  3. jQuery—— jQuery get方法+一般处理程序处理文本框内容

    网上常常看到这种交互方式,当去一个站点注冊username的时候,假设文本框内没有输入数据,或者数据输入的内容格式不正确.就会将文本框变成红色来提示你输入的内容有误. 自己将这个文本框验证的方式改变了 ...

  4. java 24 - 6 GUI之 创建只能输入数字的文本框

    需求: 创建一个含有标签和文本框的窗体,其中文本框只能输入数字 步骤:(大致上) 创建窗体对象 创建标签对象 创建文本框对象 把组件添加到窗体中 设置标签的监听事件,对键盘按下的数据进行监听 设置窗体 ...

  5. 只能输入数字的文本框-php

    导读:<inputtype="text"name="textfield"onKeyPress="javascript:alert(event k ...

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

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

  7. Vue表单输入绑定（文本框和复选框）

    文本框 <!DOCTYPE html><html>    <head>        <meta charset="utf-8">  ...

  8. jquery easyui 日历控件和文本框结合使用生成日期

    html部分---等待接收所选日期的文本框 <td> <input name='input_date' required class='easyui-textbox' id='xiw ...

  9. jquery ui dialog去除第一个文本框焦点问题

    最近做项目时,使用了jqueryUI dialog功能,当打开弹出框时,如果弹出框内容里面存在input,那么弹出框会自动获得第一个文本框焦点. 有时候,弹出框会有日期控件,一般日期控件采用focus ...

随机推荐

  1. 利用ngxtop实时监控nginx的访问情况

    关于对nginx web server的实时访问的实时监控问题,我很久之前就想实现的,现在虽有nginx自带的status扩展,但那是全局的,无法细分到vhost,并且提供的metric也很少,加之目 ...

  2. 【BZOJ】1106: [POI2007]立方体大作战tet

    题意 给定一个长度为\(2n(1 \le n \le 500000)\)的序列,\(1\)~\(n\)各出现两次,可以交换相邻两项,两个同样的数放在一起会对消,求把所有数对消的最小交换次数. 分析 如 ...

  3. nohup命令浅析

    要将一个命令放到后台执行,我们一般使用nohup sh command & &都知道是放到后台执行这个命令,那么nohup是做什么的? 这就要从unix的信号说起,unix的信号机制可 ...

  4. Linux多线程实例练习 - pthread_create()

    Linux多线程实例练习 pthread_create():创建一个线程 int pthread_create(pthread_t *tidp, const pthread_attr_t *attr, ...

  5. X-UA-Compatible/IE=EmulateIE7/IE=7

    1.<meta http-equiv="X-UA-Compatible" content="IE=5" /> 像是使用了 Windows Inter ...

  6. [转]关于event的两个常被忽略的api：isDefaultPrevented()和preventDefault()

    今天在robert penner(as3 singal的作者)的一篇blog文中顺藤摸瓜到了darron schall的另外一篇blog文(Creating Default, Cancelable E ...

  7. js从身份证号中获取出生日期和性别

    今天,在做移动端的项目中,按照设计稿的要求,是可以让用户自己输入出生日期的,我还很认真的用了刚刚知道的html5表单的日期类型,本想着终于不用日期插件就可以实现用户选择自己的出生日期了,可结果老大说, ...

  8. linux笔记十----虚拟机网络配置

    首先,参考了博客http://blog.csdn.net/qianggezhishen/article/details/45841723,可以学会怎样确定界面类型

  9. PHP后门新玩法：一款猥琐的PHP后门分析

    0x00 背景 近日,360网站卫士安全团队近期捕获一个基于PHP实现的webshell样本,其巧妙的代码动态生成方式,猥琐的自身页面伪装手法,让我们在分析这个样本的过程中感受到相当多的乐趣.接下来就 ...

  10. 允许浏览器跨域访问web服务端的解决方案

    今天和同事探讨了前后端如何真正实现隔离开发的问题,如果前端单独作为服务发布,势必会涉及到无法直接调用后端的接口的问题,因为浏览器是不允许跨域提交请求的. 所谓跨域访问,就是在浏览器窗口,和某个服务端通 ...