监听输入框变化(oninput,onpropertychange,onchange)
oninput 是 html5 的标准事件,对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有用,在内容修改后立即被触发,不像 onchange 事件需要失去焦点才触发。oninput 事件在主流浏览器的兼容情况(IE9+,chorem,safari,firefox2+)。
javascript写法:
在监听到 onpropertychange 事件后,可以使用 event 的 propertyName 属性来获取发生变化的属性名称。
<head>
<script type="text/javascript">
// Firefox, Google Chrome, Opera, Safari, Internet Explorer from version 9
function OnInput (event) {
alert ("The new content: " + event.target.value);
}
// Internet Explorer
function OnPropChanged (event) {
if (event.propertyName.toLowerCase () == "value") {
alert ("The new content: " + event.srcElement.value);
}
}
</script>
</head>
<body>
Please modify the contents of the text field.
<input type="text" oninput="OnInput (event)" onpropertychange="OnPropChanged (event)" value="Text field" />
</body>
jquery写法(需要引入jquery库):
<script>
$('textarea').bind('input propertychange', function() {
$('.msg').html($(this).val().length + ' characters');
});
</script>
监听输入框变化(oninput,onpropertychange,onchange)的更多相关文章
- 即时搜索或input实时检测监听输入框变化
js实现的文本框内容发生改变立马触发事件简单介绍:本章节介绍一下如何在文本框的内容发生变化的时候,立马触发一个事件执行响应的操作,而不是像是keydow或者keyup事件一样,只能够检测通过键盘输入导 ...
- 【转载】实时监听输入框值变化的完美方案:oninput & onpropertychange
oninput 是 HTML5 的标准事件,对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有 ...
- js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange
(1) 先说jquery, 使用 jQuery 库的话,只需要同时绑定 oninput 和 onpropertychange 两个事件就可以了,示例代码: $('#username').bin ...
- js监听输入框值的即时变化onpropertychange、oninput
js监听输入框值的即时变化onpropertychange.oninput 很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感. // // 要达到的效果 ...
- asp.net,监听输入框值的即时变化onpropertychange、oninput
作者:自由天堂发布站点:WEB六零零 网页设计制作原文地址:http://www.web600.net/html/editor/JavaScript/201001131529.html 要达到的效果 ...
- 实时监听输入框值变化:oninput & onpropertychange
结合 HTML5 标准事件 oninput 和 IE 专属事件 onpropertychange 事件来监听输入框值变化. oninput 是 HTML5 的标准事件,对于检测 textarea, i ...
- 实时监听输入框值变化的完美方案:oninput & onpropertychange
实时监听输入框值变化的完美方案:oninput & onpropertychange: 网址:http://www.cnblogs.com/lhb25/archive/2012/11/30/o ...
- html5 实时监听输入框值变化的完美方案:oninput & onpropertychange
结合 HTML5 标准事件 oninput 和 IE 专属事件 onpropertychange 事件来监听输入框值变化. H5手机端: <input type="text" ...
- oninput和onpropertychange实时监听输入框值的变化
oninput和onpropertychange实时监听输入框值的变化 传统监听输入框的做法就是使用keyup.keydown.keypress,或者change事件来实现,但keyup.keydow ...
随机推荐
- webstrom 应用 转(http://blog.csdn.net/zghekuiwu/article/details/54382145)
WebStorm 是 JetBrains 推出的一款商业的 JavaScript 开发工具 任何一个编辑器都需要保存(ctrl + s),这是所有win平台上编辑类软件的特点,但是webstorm编辑 ...
- 多系统启动光盘制作---WIN7+WinXP+老毛桃PE工具箱
1.工具: ⑴ Windows 7 ISO: ⑵ Windows XP ISO: ⑶ 老毛桃U盘启动盘制作工具V2013 制作得的ISO (含PE.DOS等): ⑷ UltraISO.EasyBoot ...
- centos6.6安装mysql5.5
在mysql官网下载mysql-5.5.54-linux2.6-x86_64.tar.gz解压:tar -zxvf mysql-5.5.54-linux2.6-x86_64.tar.gz修改名字mv ...
- C# 托管
委托 委托让我们可以把函数引用保存在变量中.这就像在 C++ 中使用 typedef 保存函数指针一样. 委托使用关键字 delegate 声明.看看这个例子,你就能理解什么是委托: 例子: 代码: ...
- 迁移,移动.vagrant.d目录
默认在 C:\Users\***\.vagrant.d 然后下面有boxes目录 想迁移到其它目录 setx VAGRANT_HOME "/d/.vagrant.d/" setx ...
- 21-nginx单机1W并发优化
一:优化思路 (1)建立socket连接 (2)打开文件,并沿socket返回.二:优化 (1) 修改nginx.conf 进程数量 默认是1024 改成20140 worker_rlimit_no ...
- jquery在网页实时显示时间;
1.定义一个显示时间的位置 <div id="shijian"> </div> 2.jquery代码 function showTime() { var c ...
- springcloud和kubernetes对比
由于这两个都不熟,所以在考虑学哪个. 先说结论:都要学,但是重点学k8s,k8s是一个更加完善的解决方案,springcloud被淘汰只是时间的问题. 从自己的经历和网上的文章两方面分析 个人经历: ...
- MongoDB的对象的创建
package com.voice.db; import com.mongodb.DB; import com.mongodb.DBCollection; import com.mongodb.Mon ...
- idea创建普通java项目以及maven创建项目过程(转)
1. idea创建一个普通项目流程 http://blog.csdn.net/testcs_dn/article/details/52303941 2. idea创建maven项目流程 http:// ...