jquery实现输入框实时统计字数和设置字数限制功能
<html>
<header>
<meta charset="utf-8">
<title>测试实时字数显示</title>
</header>
<body>
<div style="text-align: center;margin-top: 8%;">
<h3>字数输入实时统计</h3>
<textarea id="area" name="ss" placeholder="请输入文本内容" style="width: 50%;height: 35%;"></textarea>
<p>当前字数为:<span id="text-count">0</span>,最大字数支持1.5万字(一个汉字、一个英语字母、一个标点符号均占用一个字符。)</p>
</div>
</body> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript">
/*字数限制 需要修改字数范围,下面15000换掉即可*/
$("#area").on("input propertychange", function() {
var $this = $(this),
_val = $this.val(),
count = "";
if (_val.length > 15000) {
$this.val(_val.substring(0, 15000));
}
count =$this.val().length;
$("#text-count").text(count);
});
</script>
</html>
jquery实现输入框实时统计字数和设置字数限制功能的更多相关文章
- textarea输入框实时统计输入字符数
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JavaScript 实现textarea限制输入字数, 输入框字数实时统计更新,输入框实时字数计算移动端bug解决
textarea称文本域,又称文本区,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到.与单行文本框text控件不同,它不能通过maxlength属性来限制字数,为此必须寻求其他方法来加以限制 ...
- jQuery - 实时统计输入框输入个数(中文输入法适用)
经常在实时统计文本框输入多少字的时候,有时会出现不及时统计,特别是在中文输入法下. 为了实时准确统计,可以修改代码如下: $(function() { $("#txtT ...
- jquery easyui 输入框 禁止输入负数 设置属性data-options="min:0,required:true"
jquery easyui 输入框 禁止输入负数 设置属性data-options="min:0,required:true" <input id="days& ...
- jquery的输入框自动补全功能+ajax
jquery的输入框自动补全功能+ajax 2017年05月10日 18:51:39 辣姐什么鬼 阅读数:1461 标签: web前端 更多 个人分类: web前端 内容参考网友文章写成,原博的链 ...
- oninput、onchange与onpropertychange事件的区别, 与input输入框实时检测
这几天项目着急,同时也学到好多以前没有接触过的知识.oninput.onchange与onpropertychange事件的区别, 与input输入框实时检测 onchange事件只在键盘或者鼠标操作 ...
- 基于Bootstrap使用jQuery实现输入框组input-group的添加与删除-改进版
上一次说到了基于Bootstrap使用jQuery实现输入框组input-group的添加与删除 ,初始状态下只有一个输入框组,可以通过点击输入框组的右侧“+”(或自定义的文字)可以在原输入框组的下面 ...
- NetHogs---按进程或程序实时统计网络带宽使用率。
NetHogs是一个开源的命令行工具(类似于Linux的top命令),用来按进程或程序实时统计网络带宽使用率. 来自NetHogs项目网站: NetHogs是一个小型的net top工具,不像大多数工 ...
- 实时统计每天pv,uv的sparkStreaming结合redis结果存入mysql供前端展示
最近有个需求,实时统计pv,uv,结果按照date,hour,pv,uv来展示,按天统计,第二天重新统计,当然了实际还需要按照类型字段分类统计pv,uv,比如按照date,hour,pv,uv,typ ...
随机推荐
- Windows安装Python3 curses模块
目录 0.前提 1.pip install wheel 2.下载.whl文件 3.pip install 它 参考 0.前提 确定你已经配置好了Python相关环境,可以正常在命令行使用pip安装. ...
- ubuntu之路——day17.2 RGB图像的卷积、多个filter的输出、单个卷积层的标记方法
和单层图像的卷积类似,只需要对每一个filter构成的三层立方体上的每一个数字与原图像对应位置的数字相乘相加求和即可. 在这个时候可以分别设置filter的R.G.B三层,可以同时检测纵向或横向边缘, ...
- Python语言编写BP神经网络
Python语言编写BP神经网络 2016年10月31日 16:42:44 ldy944758217 阅读数 3135 人工神经网络是一种经典的机器学习模型,随着深度学习的发展神经网络模型日益完善 ...
- jmeter BeanShell断言(四)
Bean Shell常用内置变量 JMeter在它的BeanShell中内置了变量,用户可以通过这些变量与JMeter进行交互,其中主要的变量及其使用方法如下: log:写入信息到jmeber.log ...
- PostgreSQL中的一些日志
1.Write Ahead Log(WAL日志)预写日志(WAL)是保证数据完整性的标准方法.在有关交易处理的大多数(如果不是全部)书籍中都可以找到详细说明. 简而言之,WAL的核心概念是,只有在记录 ...
- Spring Boot源码中模块详解
Spring Boot源码中模块详解 一.源码 spring boot2.1版本源码地址:https://github.com/spring-projects/spring-boot/tree/2.1 ...
- (4)Flask项目模板渲染初体验
一.准备静态资源 将项目使用到的静态资源拷贝到static目录 二.创建前台首页html 创建templates/home/home.html页面,内容包含导航和底部版权两部分,中间内容区域为模板标签 ...
- openresty开发系列38--通过Lua+Redis 实现动态封禁IP
openresty开发系列38--通过Lua+Redis 实现动态封禁IP 一)需求背景为了封禁某些爬虫或者恶意用户对服务器的请求,我们需要建立一个动态的 IP 黑名单.对于黑名单之内的 IP ,拒绝 ...
- 必须要注意的 C++ 动态内存资源管理(六)——vector的简单实现
必须要注意的 C++ 动态内存资源管理(六)——vector的简单实现 十六.myVector分析 我们知道,vector类将其元素存放在连续的内存中.为了获得可接受的性能,vetor ...
- 泡泡一分钟:Teaching Robots to Draw
Teaching Robots to Draw 教会机器人画画https://h2r.cs.brown.edu/wp-content/uploads/kotani19.pdf Atsunobu Kot ...