js 实现textarea剩余字数统计
1 针对textarea剩余字数统计
2 <div class="fankui-textarea">
3 <span>留言:</span> <span class="wordwrap fr">你还可以输入<var class="word">500</var>个字</span>
4 <textarea name="content" placeholder="此处限定500字"></textarea>
5 </div>
6 <script>
7 /*textarea还剩余字数统计*/
8 $(function () {
9 var wordCount = $('.fankui-textarea');
10 var textArea = wordCount.find('textarea');
11 var word = wordCount.find(".word");
12 statInputNum(textArea, word);
13 });
14 function statInputNum(textArea, word) {
15 var max = word.text();
16 var curLength;
17 textArea[0].setAttribute('maxlength', max);
18 curLength = textArea.val().length;
19 word.text(max-curLength);
20 textArea.on('input propertychange', function () {
21 var _value = $(this).val().replace(/\n/gi,"");
22 word.text(max - _value.length);
23 });
24 }
25 </script>
js 实现textarea剩余字数统计的更多相关文章
- textarea还剩余字数统计
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title> ...
- textarea还剩余字数统计,支持复制粘贴的时候统计字数
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- 使用JQ实现统计剩余字数
JQ实现统计文本框剩余字数 效果图: 代码如下,复制即可使用: <html lang="en"> <head> <meta charset=" ...
- 如何实现textarea中获取动态剩余字数的实现
工作中遇到一个案例,之前没有写过,今儿啃了半个下午硬是给写出来,灰常又成就感!当然对于js大牛来说这根本不算啥,但是对于我自己的js能力又向前迈出一小步. 案例介绍:我们常见到有的网站有textare ...
- JS实现动态提示文本框可输入剩余字数(类似发表微博数字提示)
一.实现效果: 为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,项目中需要通过判断提示文本框剩余可输入字数. html & JS: <div> <textare ...
- textarea标签提示录入剩余字数
textarea标签提示录入剩余字数 <textarea onkeydown="checkMaxInput(this,300)" onkeyup="checkMax ...
- 类似新浪 腾讯微博字数统计 控制js(区分中英文 符号)
<script> ; function Q(s) { return document.getElementById(s); } function checkWord(c) { len = ...
- JS控制文本框textarea输入字数限制
<html> <head> <title>JS限制Textarea文本域字符个数</title> <meta http-equiv="C ...
- JS控制文本框textarea输入字数限制的方法
<html> <head runat="server"> <title></title> <script type=" ...
随机推荐
- 自动化运维Ansible-01-安装及简单的使用
实验环境:Centos 7.x Ansible版本:ansible 2.9.13 服务端的操作 1.系统默认的yum仓库中没有找到ansible,这里我们先安装epel源(需要用到CentOS-Bas ...
- 系统日志报错i8042prt无法加载
原因如下: 解决方法为: 此报错可以直接忽略,不过由此可能导致即插即用(plugplay)报错,在即插即用报错时,重启服务器即可.
- [Luogu P4124] [CQOI2016]手机号码 (数位DP)
题面 传送门:洛咕 Solution 感谢神仙@lizbaka的教学 这题是数位DP的非常非常模板的题目,只是状态有点多 . 这题我使用记忆化搜索实现的 中国有句古话说的好,有多少个要求就设多少个状态 ...
- 【Elasticsearch 技术分享】—— 十张图带大家看懂 ES 原理 !明白为什么说:ES 是准实时的!
前言 说到 Elasticsearch ,其中最明显的一个特点就是 near real-time 准实时 -- 当文档存储在Elasticsearch中时,将在1秒内以几乎实时的方式对其进行索引和完全 ...
- ubuntu常见问题有效解决办法
1.关于weget "无法建立SSL连接"的解决方法 wget在使用HTTPS协议时,默认会去验证网站的证书,而这个证书验证经常会失败. 解决办法 原命令加上"--no- ...
- 庐山真面目之三微服务架构Consul版本实现
庐山真面目之三微服务架构Consul版本实现 一.简介 在上一篇文章<庐山真面目之二微服务架构NGINX版本实现>中,我们已经探讨了如何搭建基于Nginx 网关的微服务 ...
- 深入探讨HBASE
HBASE基础 1. HBase简介HBase是一个高可靠.高性能.面向列的,主要用于海量结构化和半结构化数据存储的分布式key-value存储系统. 它基于Google Bigtable开源实现,但 ...
- uboot分析——初始化
1.start.S 初始化 icache 看门狗 时钟 DDR 设置栈 初始化串口,并打印 OK 以上完成 lowlevel_init -------------------------------- ...
- 记一次ceph的故障修复(20160408)
ceph的在正常运行的时候基本不会出现故障,出现故障一般在变动的时候,具体有下面几种可能出现的情形 软件升级 增加存储节点 减少存储节点 调整副本数目 调整pg数目 磁盘出现损坏 节点网络出现异常 以 ...
- appium 常用方法总结
1.appium启动任意的Activity 在手机上启动任意的Activty用driver.start_activity方法,如果启动的Activity不是测试应用程序的一部分,它也将启动该活动的应用 ...