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 相关文章推荐
js获取图片长和宽度的代码
Nov 24 Javascript
浅谈javascript属性onresize
Apr 20 Javascript
jQuery检测某个元素是否存在代码分享
Jul 09 Javascript
JS+CSS实现简易的滑动门效果代码
Sep 24 Javascript
jQuery实现滚动鼠标放大缩小图片的方法(附demo源码下载)
Mar 05 Javascript
JS组件Bootstrap ContextMenu右键菜单使用方法
Apr 17 Javascript
js变量提升深入理解
Sep 16 Javascript
node中Express 动态设置端口的方法
Aug 04 Javascript
JS鼠标3次点击事件实现代码及扩展思路
Sep 12 Javascript
Node.js的进程管理的深入理解
Jan 09 Javascript
vue 导航内容设置选中状态样式的例子
Nov 01 Javascript
Postman参数化实现过程及原理解析
Aug 13 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
PHP内核探索:哈希表碰撞攻击原理
2015/07/31 PHP
通过JavaScript控制字体大小的代码
2011/10/04 Javascript
javascript之典型高阶函数应用介绍
2013/01/10 Javascript
jquery animate实现鼠标放上去显示离开隐藏效果
2013/07/21 Javascript
jQuery中not()方法用法实例
2015/01/06 Javascript
js实现遮罩层弹出框的方法
2015/01/15 Javascript
Bootstrap3 Grid system原理及应用详解
2016/09/30 Javascript
jQuery实现的模拟弹出窗口功能示例
2016/11/24 Javascript
微信小程序 动态的设置图片的高度和宽度详解及实例代码
2017/02/24 Javascript
Javascript实现登录记住用户名和密码功能
2017/03/22 Javascript
jquery easyui如何实现格式化列
2017/07/30 jQuery
如何理解Vue的作用域插槽的实现原理
2017/08/19 Javascript
vue地址栏直接输入路由无效问题的解决
2018/11/15 Javascript
Antd下拉选择,自动匹配功能的实现
2020/10/24 Javascript
[02:48]DOTA2英雄基础教程 拉席克
2013/12/12 DOTA
[38:21]2014 DOTA2国际邀请赛中国区预选赛5.21 TongFu VS LGD-CDEC
2014/05/22 DOTA
[06:45]2018DOTA2亚洲邀请赛 4.5 SOLO赛 Sccc vs Maybe
2018/04/06 DOTA
python通过urllib2爬网页上种子下载示例
2014/02/24 Python
python实现可以断点续传和并发的ftp程序
2016/09/13 Python
python批量设置多个Excel文件页眉页脚的脚本
2018/03/14 Python
Python3批量生成带logo的二维码方法
2019/06/24 Python
Python socket非阻塞模块应用示例
2019/09/12 Python
手把手教你pycharm专业版安装破解教程(linux版)
2019/09/26 Python
Python基础之高级变量类型实例详解
2020/01/03 Python
详解pycharm的python包opencv(cv2)无代码提示问题的解决
2021/01/29 Python
详解tf.device()指定tensorflow运行的GPU或CPU设备实现
2021/02/20 Python
viagogo法国票务平台:演唱会、体育比赛、戏剧门票
2017/03/27 全球购物
英国信箱在线鲜花速递公司:Bloom & Wild
2019/03/10 全球购物
迟到检讨书900字
2014/01/14 职场文书
教师党的群众路线教育实践活动剖析材料
2014/10/09 职场文书
2014年餐厅服务员工作总结
2014/11/18 职场文书
药店收银员岗位职责
2015/04/07 职场文书
监护人证明
2015/06/19 职场文书
超市店长竞聘书
2015/09/15 职场文书
担保书范文
2019/07/09 职场文书
Python实现Telnet自动连接检测密码的示例
2021/04/16 Python