jquery实现textarea输入框限制字数的方法


Posted in Javascript onJanuary 15, 2015

本文实例讲述了jquery实现textarea输入框限制字数的方法。分享给大家供大家参考。具体分析如下:

网上有使用属性 disabled 来实现,这个不好,想修改都没有修改。当然,这个也不是很完美。

<html>

<head>

<title> jquery完美实现textarea输入框限制字数</title>

<meta http-equiv="content-type" content="text/html;charset=utf-8" />

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

<script type="text/javascript">

 $(function(){

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

   var len = $(this).val().length;

   if(len > 139){

    $(this).val($(this).val().substring(0,140));

   }

   var num = 140 - len;

   $("#word").text(num);

  });

 });

</script>

<style type="text/css">

h6{color:blue;}

textarea{resize:none;}

#word{color:red;}

</style>

</head>

<body>

<h6>说点什么吧,你可以输入<span>140</span>个字,现在剩余<span id="word">140</span>个</h6>

<textarea name="con" id="weibo" cols="45" rows="6"></textarea>

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JS getStyle获取最终样式函数代码
Apr 01 Javascript
JQuery 学习技巧总结
May 21 Javascript
js创建对象的几种常用方式小结(推荐)
Oct 24 Javascript
ASP.NET jQuery 实例15 通过控件CustomValidator验证CheckBoxList
Feb 03 Javascript
关于删除时的提示处理(确定删除吗)
Nov 03 Javascript
window.location.href IE下跳转失效的解决方法
Mar 27 Javascript
vue日期组件 支持vue1.0和2.0
Jan 09 Javascript
JavaScript实现一个空中避难的小游戏
Jun 06 Javascript
利用vue.js实现被选中状态的改变方法
Feb 08 Javascript
浅谈super-vuex使用体验
Jun 25 Javascript
详解JavaScript中操作符和表达式
Sep 12 Javascript
layui下拉框获取下拉值(select)的例子
Sep 10 Javascript
28个常用JavaScript方法集锦
Jan 14 #Javascript
jquery单选框radio绑定click事件实现方法
Jan 14 #Javascript
jquery移动节点实例
Jan 14 #Javascript
jquery获取checkbox的值并post提交
Jan 14 #Javascript
js打造数组转json函数
Jan 14 #Javascript
使用jquery 简单实现下拉菜单
Jan 14 #Javascript
jquery实现鼠标滑过小图时显示大图的方法
Jan 14 #Javascript
You might like
PHP Directory 函数的详解
2013/03/07 PHP
thinkphp的CURD和查询方式介绍
2013/12/19 PHP
详解php用static方法的原因
2018/09/12 PHP
javascript 处理HTML元素必须避免使用的一种方法
2009/07/30 Javascript
JQuery的Alert消息框插件使用介绍
2010/10/09 Javascript
js中onload与onunload的使用示例
2013/08/25 Javascript
jQuery拖拽插件gridster使用指南
2015/04/21 Javascript
javascript Promise简单学习使用方法小结
2016/05/17 Javascript
详解Javascript ES6中的箭头函数(Arrow Functions)
2016/08/24 Javascript
单行 JS 实现移动端金钱格式的输入规则
2017/05/22 Javascript
详解VueJs前后端分离跨域问题
2017/05/24 Javascript
JavaScript之Date_动力节点Java学院整理
2017/06/28 Javascript
js+html5实现页面可刷新的倒计时效果
2017/07/15 Javascript
Material(包括Material Icon)在Angular2中的使用详解
2018/02/11 Javascript
详解Nodejs内存治理
2018/05/13 NodeJs
浅谈使用mpvue开发小程序需要注意和了解的知识点
2018/05/23 Javascript
JavaScript常见事件处理程序实例总结
2019/01/05 Javascript
Moment.js实现多个同时倒计时
2019/08/26 Javascript
vue路由跳转传递参数的方式总结
2020/05/10 Javascript
[47:12]TFT vs Secret Supermajor小组赛C组 BO3 第三场 6.3
2018/06/04 DOTA
Python 列表(List) 的三种遍历方法实例 详解
2017/04/15 Python
Python信息抽取之乱码解决办法
2017/06/29 Python
Python MySQLdb 使用utf-8 编码插入中文数据问题
2018/03/13 Python
浅谈python 读excel数值为浮点型的问题
2018/12/25 Python
Python中正反斜杠(‘/’和‘\’)的意义与用法
2019/08/12 Python
利用css3如何设置没有上下边的列表间隔线
2017/07/03 HTML / CSS
澳大利亚在线时尚精品店:Hello Molly
2018/02/26 全球购物
CK加拿大官网:Calvin Klein加拿大
2020/03/14 全球购物
JNI的定义
2012/11/25 面试题
25道Java面试题集合
2013/05/21 面试题
化工专业个人的求职信范文
2013/11/28 职场文书
党员个人思想汇报
2013/12/28 职场文书
征婚广告词
2014/03/17 职场文书
大学学习计划书范文
2014/05/02 职场文书
Vue组件更新数据v-model不生效的解决
2022/04/02 Vue.js
python井字棋游戏实现人机对战
2022/04/28 Python