使用 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 ...
随机推荐
- React Native 之 数据持久化
前言 因为 实战项目系列 涉及到数据持久化,这边就来补充一下. 如本文有错或理解偏差欢迎联系我,会尽快改正更新! 如有什么问题,也可直接通过邮箱 277511806@qq.com 联系我. demo链 ...
- Redis应用----消息传递
1.摘要 消息传递这一应用广泛存在于各个网站中,这个功能也是一个网站必不可少的.常见的消息传递应用有,新浪微博中的@我呀.给你评论然后的提示呀.赞赞赞提示.私信呀.甚至是发微博分享的新鲜事:知乎中的私 ...
- OpenStack_Glance
什么是Glace Glance即image service(镜像服务),就是为创建虚拟机提供镜像的地方 为什么要有Glance 这个问题问的好,openstack就是构建Iaas平台对外提供虚拟机的啊 ...
- DPDK QoS之分层调度器
原创翻译,转载请注明出处. 分层调度器的时机主要体现在TX侧,正好在传递报文之前.它的主要目的是在每个网络节点按照服务级别协议来对不同的流量分类和对不同的用户的报文区分优先级并排序. 一.概述分层调度 ...
- Vijos1327回文词【动态规划】
回文词 回文词是一种对称的字符串--也就是说,一个回文词,从左到右读和从右到左读得到的 结果是一样的.任意给定一个字符串,通过插入若干字符,都可以变成一个回文词.你的任务是写 一个程序,求出将给定字符 ...
- 老李秘技:loadrunner回放脚本错误提示Error: "HTTP Status-Code 500"
老李秘技:loadrunner回放脚本错误提示Error: "HTTP Status-Code 500" 当脚本回放的时候出现错误提示Error: "HTTP Sta ...
- Kubernetes DNS 简介
环境 $ sudo lsb_release -a No LSB modules are available. Distributor ID: Ubuntu Description: Ubuntu 16 ...
- 跟着刚哥梳理java知识点——深入理解String类(九)
一.String类 想要了解一个类,最好的办法就是看这个类的实现源代码,来看一下String类的源码: public final class String implements java.io.Ser ...
- .NET Framework 4.7 安装
我们打开.NET Framework下载界面: https://www.microsoft.com/net/download/framework 这时你会发现,我们能下载的.NET Framework ...
- Spring Cloud搭建微服务架构----前言
前言 微服务并不神秘,只是在互联网技术发展过程中的一个产物,整个架构系统随着客户端的多样性,服务越来越多,devops的发展而产生的架构变种. 许多公司,通过采用微处理结构模式解决单体应用的问题,分解 ...