使用 onpropertychange 和 oninput 检测 input、textarea输入改变
检测input、textarea输入改变事件有以下几种:
<!--superGG1990原创发表于博客园http://www.cnblogs.com/superGG1990,其他商业网站转载均为盗版,个人博客网站转载请注明出处 2017-05-12-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>监听输入事件</title>
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<style>
b {color:red; font-size:18px;}
</style>
</head>
<body>
<textarea style="width:800px; height:300px;"></textarea>
<div>你已经输入了<b>0</b>个字</div>
<script>
$('textarea').on('input propertychange',function(){
var val = $(this).val()
var textNum = val.length;
if(textNum > 200){
textNum = 200;
}
$('b').html(textNum)
//超过200个字提示
if(val.length>200){
var textVal = val.substring(0,200)
$(this).val(textVal)
alert('评论内容大于200字')
}
})
</script>
</body>
</html>
superGG1990 原创发表于博客园 www.cnblogs.com/superGG1990,其他商业网站转载均为盗版,个人博客网站转载请注明出处 2017-05-12
使用 onpropertychange 和 oninput 检测 input、textarea输入改变的更多相关文章
- 同时绑定onpropertychange 和 oninput 事件,实时检测 input、textarea输入改变事件,支持低版本IE,支持复制粘贴
实时检测 input.textarea输入改变事件,支持低版本IE,支持复制粘贴 检测input.textarea输入改变事件有以下几种: 1.onkeyup/onkeydown 捕获用户键盘输入事件 ...
- 设置输入域(input/textarea)中文本光标的位置
以前记录了一篇 将光标定位于输入框最右侧的实现方式 ,实现光标定位在文本的最末.这种需求往往在修改现有的文本.有时可能还需要把光标定位在首位,或者中间某个位置,这就需要实现一个更通用的方法. 这个方法 ...
- 转 移动端-webkit-user-select:none导致input/textarea输入框无法输入
移动端webview中写页面的时候发现个别Android机型会导致input.textareat输入框无法输入(键盘可以弹起,不是webView.requestFocus(View.FOCUS_DOW ...
- 移动端-webkit-user-select:none导致input/textarea输入框无法输入
这个问题,也算是个大坑了. 最开始的开始,是因为我们在做大装盘活动的时候,发现在ios上面出现了这样的问题:点击“转”按钮,ios上面会有延迟并且会出现图片的阴影,这个肯定就不好看了撒,然后,找吧,改 ...
- js监听输入框值的即时变化onpropertychange、oninput
js监听输入框值的即时变化onpropertychange.oninput 很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感. // // 要达到的效果 ...
- 兼容Firefox和IE的onpropertychange事件oninput
原文 兼容Firefox和IE的onpropertychange事件oninput onpropertychange能够捕获每次输入值的变化.例如:对象的value值被改变时,onpropertych ...
- input效果:当鼠标在input中输入文字是改变内部文字效果
主要用到属性:onpropertychange事件(属性改变时触发的事件),oninput属性(当input有输入时发生的事件) onpropertychange事件是IE专属事件 oninput属性 ...
- 关于onpropertychange与oninput的兼容问题
关于onpropertychange与oninput的用法,网上一大堆,但还是有不兼容的时候,比如说,我想计下,一个input的值改变了多少次,如果写成兼容写法就为 <!doctype html ...
- input textarea监听鼠标粘贴
发现一个问题,在input/textarea中如果是鼠标粘贴内容进去,发现判断不了value的改变,html代码如下: <!doctype html> <html> <h ...
随机推荐
- xgboost-python参数深入理解
由于在工作中应用到xgboost做特征训练预测,因此需要深入理解xgboost训练过程中的参数的意思和影响. 通过search,https://www.analyticsvidhya.com/blog ...
- linux使用LVM合并硬盘
目的将两块空硬盘合并为"一块",挂载到指定目录下,达到在一个目录使用2块硬盘所有空间的效果.条件硬盘1 /dev/sdb 硬盘2 /dev/sdc方法创建pvpvcreate /d ...
- 利用echo命令实现倒计时的功能
echo -e:启用反斜线控制字符的转换 -E:关闭反斜线控制字符的转换(预设如此) -n:取消行末之换行符号(与 -e 选项下的 \c 字符同意 -e参数下的控制参数 \ ...
- underscore.js,jquery.js源码阅读
(function() { // Baseline setup // -------------- // Establish the root object, `window` in the brow ...
- 简学Python第七章__class面向对象高级用法与反射
Python第七章__class面向对象高级用法与反射 欢迎加入Linux_Python学习群 群号:478616847 目录: Python中关于oop的常用术语 类的特殊方法 元类 反射 一.P ...
- 用代码控制退出APP
+ (void)exitApplication { AppDelegate *app = [UIApplication sharedApplication].delegate; UIWindow *w ...
- 老李推荐:第8章2节《MonkeyRunner源码剖析》MonkeyRunner启动运行过程-解析处理命令行参数 2
我们这一节会先去分析下monkeyrunner是如何对参数进行处理的,我们跳转到MonkeyRunnerOptions这个类里面的processOptions这个方法: 93 public sta ...
- Android 接入 OpenCV库的三种方式
OpenCV是一个基于BSD许可(开源)发行的跨平台计算机视觉库,可以运行在Linux.Windows.Android和Mac OS操作系统上.它轻量级而且高效——由一系列 C 函数和少 ...
- Python可视化学习(2):Matplotlib快速绘图基础
Matplotlib将大部分的绘图对象都封装成为对象,故理论上所有的图表元素(如Line2D, Text,Label等)都是对象,都可以将其在图表中提取出来并配置实例的属性.同时,Matplotlib ...
- 迭代的是人,递归的是神。——L. Peter Deutsch
递归,数学里面叫recursion,其实就是递推关系. 中学数学有一部分其实就是递归的非常典型的做法,不过老师们都没怎么扩展,新课标必修五第二章数列应该算是我们第一次接触递推的概念了. 其实说到递归 ...