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. Codeforces Round #242 (Div. 2) B. Megacity

    按照半径排序,然后累加人数直到超过百万 #include <iostream> #include <algorithm> #include <cmath> #inc ...

  2. Codeforces Round #209 (Div. 2) B. Permutation

    解题思路: 如果序列a是单调递增的,则序列为1,2,..... 2n,则将给出的式子化简得Σ(a2i - a2i-1) = n 如果序列a是单调递减的,则序列为2n,.........2, 1,则将给 ...

  3. display: block; -webkit-margin-before: 1em; -webkit-margin-after: 1em; -webkit-margin-start: 0px; -webkit-margin-end: 0px;

    总的来说:这是CSS3.0的对于文章段P容器的定义方法语句! display:block这个样式,只定义了P容器为一个块; 后面四句是CSS3中的样式定义方法: -webkit-margin-befo ...

  4. 【Eclipse】几个最重要的快捷键

    1几个最重要的快捷键    代码助手:Ctrl+Space(简体中文操作系统是Alt+/) 快速修正:Ctrl+1 单词补全:Alt+/ 打开外部Java文档:Shift+F2   显示搜索对话框:C ...

  5. js中操作数组的一些方法【转】

    增 push   在数组的末尾添加一个或多个元素,并返回新的长度.  array.push(1,2,3.........) unshift  在数组的开头添加一个或多个元素,并返回新的长度. arra ...

  6. Spring MVC和Struts2的比较的优点

    Spring MVC和Struts2的区别: 机制:spring mvc的入口是servlet,而struts2是filter(这里要指出,filter和servlet是不同的.以前认为filter是 ...

  7. javascrit2.0完全参考手册(第二版) 第2章第1节 基本定义

    在这里,我们介绍一些将要使用的编程语言术语.表2-1提供了精确定义的概念. Table 2-1: 编程语言的基本术语 名字 定义 例子 Token令牌 最小的不可分割的词汇的语言单位.一个连续的字符序 ...

  8. 360safe安全卫士防网站攻击源码

    近段时间,公司网站老被攻击,于是研究起防止攻击方法,当然无外乎就是SQL注入之类的问题,无意间发现了一个360安全卫士提供的源码,觉得挺好的,咋们暂且不说防攻击效果,至少思路是很好的,奉献给大家,大家 ...

  9. 从就业面分析web前端开发工程师就业前景（2011.6)

    案例一 公司名称:法国电信北京研发中心 工作地点:北京 联系方式:hao.luan@orange-ftgroup.com 栾先生 岗位名称:web 前端开发工程师 岗位要求: 1. 计算机或相关专业本 ...

  10. IO流，File类的测试........课堂加总结

    package liu0926; import java.io.File; import java.io.IOException; public class Text01 { public stati ...