使用 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 ...
随机推荐
- python遍历一个目录，输出所有文件名
python遍历一个目录,输出所有文件名 python os模块 os import os def GetFileList(dir, fileList): newDir = dir if os. ...
- 大数据学习记录之ssh绵密登录
1,在服务器端 ssh-keygen 2,使用ssh-copy-id 192.168.2.146 3,再测试一下ssh 192.168.2.146 exit 退出当前登录 具体流程为:A,B两台机器 ...
- 【Flex】去除外边框，底背景透明，改变exe的icon
一.去除程序外边框 1.在 xx-app.xml文件里,找到 <!-- <systemChrome></systemChrome> --> 这句话,然后删掉注释 ...
- 一步操作配置Word环境
我们在开始编辑Word文档的时候,会发现有些事情我们总需要预先操作一下,比如100%普通视图.显示隐藏特殊标记.显示标尺.最大化窗口.显示导航窗格啥的,每次去操作,感觉很烦,那么通过下面这个宏代码可以 ...
- js全选checkbox框
html: <input type="checkbox" id="checkbox1" value="1" onclick=&quo ...
- Selenium Grid2
简介 使用selenium-grid可以远程执行测试的代码,核心步骤:grid --> server-->chromedriver驱动 -->chrome浏览器 利用Selenium ...
- FPGA中将十进制数在数码管中显示（verilog版）--二进制转换为BCD码
这周有朋友问怎样在fpga中用数码管来显示一个十进制数,比如1000.每个数码管上显示一位十进制数.如果用高级语言来分离各位,只需要分别对该数做1000,100,10对应的取商和取余即可分离出千百十个 ...
- IE6-7下margin-bottom不兼容解决方法（非原创，视频中看到的）
在IE低版本下有很多不兼容,现在将看到的 IE6-7下margin-bottom不兼容解决方法 演示一下,方便日后自己查阅. <!DOCTYPE html> <html la ...
- Windows文件路径转换为java中可识别的文件路径的转义方法，（另附转义多种格式）
ps:欢迎加qq好友:2318645572,交流学习 一:路径转化 Windows中的文件路径格式为 D:\eclipse\apache-tomcat-7.0.67\wtpwebapps\... Ja ...
- File类遍历目录及文件
1. 构造函数 File(String args0)//使用一个表示文件或目录的路径的字符串创建一个File对象 File(URL args0)//使用一个URL对象创建File对象 File(Fil ...