jQuery实现统计输入文字个数的方法


Posted in Javascript onMarch 11, 2015

本文实例讲述了jQuery实现统计输入文字个数的方法。分享给大家供大家参考。具体如下:

jQuery统计输入文字个数可以使用在统计回复字数,标题字数长度提示,增加友好度提高用户体验。代码如下:

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

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

<title>jQuery统计文字个数</title>

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

</head>

<body>

<ul>

  <li>

    <span>新闻标题:</span>

    <span><input id="news_title" name="news_title" type="text" size="60" onkeyup="title_len();" onclick="title_len();"  maxlength="80"/>

    <span id="titlelen">0/80</span>

  </li>

</ul>

</body>

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

function title_len(){

 var value = $('#news_title').val().length;

 if(value == 80){

  var string = "<span style=\"color:#FF0000\">"+value+"/80</span>";

 }else{

  var string = "<span style=\"color:#FF0000\">"+value+"</span>/80";

 }

 $('#titlelen').html(string);

}

</script>

</html>

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

Javascript 相关文章推荐
让Firefox支持event对象实现代码
Nov 07 Javascript
jQuery中的常用事件总结
Dec 27 Javascript
JavaScript QueryString解析类代码
Jan 17 Javascript
javascript页面加载完执行事件代码
Feb 11 Javascript
Javascript基础_嵌入图像的简单实现
Jun 14 Javascript
jquery删除数组中重复元素
Dec 05 Javascript
Bootstrap table 定制提示语的加载过程
Feb 20 Javascript
微信小程序倒计时功能实现代码
Nov 09 Javascript
实现高性能javascript的注意事项
May 27 Javascript
JavaScript代码异常监控实现过程详解
Feb 17 Javascript
vue实现在线学生录入系统
May 30 Javascript
node.js如何根据URL返回指定的图片详解
Oct 21 Javascript
jQuery处理json数据返回数组和输出的方法
Mar 11 #Javascript
jquery实现表格本地排序的方法
Mar 11 #Javascript
jQuery实现渐变下拉菜单的简单方法
Mar 11 #Javascript
jQuery实现新消息闪烁标题提示的方法
Mar 11 #Javascript
javascript实现详细时间提醒信息效果的方法
Mar 11 #Javascript
JavaScript实现SHA-1加密算法的方法
Mar 11 #Javascript
JavaScript前补零操作实例
Mar 11 #Javascript
You might like
destoon整合UCenter图文教程
2014/06/21 PHP
PHP针对JSON操作实例分析
2015/01/12 PHP
php获取目录中所有文件名及判断文件与目录的简单方法
2017/03/04 PHP
YII2框架中excel表格导出的方法详解
2017/07/21 PHP
如何解决PHP获取不到SESSION信息之一般情况
2019/10/10 PHP
判断JS对象是否拥有某种属性的两种方式
2013/12/02 Javascript
Javascript基础教程之变量
2015/01/18 Javascript
JS实现超精简的链接列表在固定区域内滚动效果代码
2015/11/04 Javascript
使用Jasmine和Karma对AngularJS页面程序进行测试
2016/03/05 Javascript
js添加千分位的实现代码(超简单)
2016/08/01 Javascript
vue.js组件之间传递数据的方法
2017/07/10 Javascript
javascript自定义事件功能与用法实例分析
2017/11/08 Javascript
在Vue项目中引入腾讯验证码服务的教程
2018/04/03 Javascript
详解webpack的文件监听实现(热更新)
2020/09/11 Javascript
[50:29]2014 DOTA2华西杯精英邀请赛 5 24 DK VS iG
2014/05/26 DOTA
Python开发编码规范
2006/09/08 Python
python实现的二叉树算法和kmp算法实例
2014/04/25 Python
Python 的类、继承和多态详解
2017/07/16 Python
详谈python read readline readlines的区别
2017/09/22 Python
python得到电脑的开机时间方法
2018/10/15 Python
python3对拉勾数据进行可视化分析的方法详解
2019/04/03 Python
PyQt5组件读取参数的实例
2019/06/25 Python
详解Python的三种拷贝方式
2020/02/11 Python
在tensorflow下利用plt画论文中loss,acc等曲线图实例
2020/06/15 Python
matplotlib 多个图像共用一个colorbar的实现示例
2020/09/10 Python
使用AJAX和Django获取数据的方法实例
2020/10/25 Python
CSS3实现彩色进度条动画的示例
2020/10/29 HTML / CSS
数控技术专业推荐信
2013/11/01 职场文书
护理专业毕业生自我鉴定总结
2014/03/24 职场文书
中学生国旗下讲话稿
2014/04/26 职场文书
委托书的写法
2014/09/16 职场文书
2014年老干部工作总结
2014/11/21 职场文书
2016年春季运动会通讯稿
2015/11/25 职场文书
浅谈golang package中init方法的多处定义及运行顺序问题
2021/05/06 Golang
python 开心网和豆瓣日记爬取的小爬虫
2021/05/29 Python
Python爬虫之自动爬取某车之家各车销售数据
2021/06/02 Python