监听输入框变化(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 ...
随机推荐
- ViewPager+Fragment 滑动菜单效果 实现步骤
1.xml中引用ViewPager <android.support.v4.view.ViewPager android:id="@+id/viewPa ...
- nfs部署和优化 -2
客户端: cat /etc/passwd 显示用户 weifeng 500 服务端: vim /etc/exports /mnt 192.168.1.105(rw,sync,all_squash, ...
- Build Your Jekyll Blog (On Github)
http://kevinjmh.github.io/web/2014/04/20/build-your-jekyll-blog/ 20 April 2014 On GitHub Follow the ...
- Linux环境变量PS1配置
1. 说明: 在Shell下,我们能够拥有更加色慘斑斓的提示行信息.这能够通过改变bash的$PS1环境变量还设置,如以下就是提示行的一种: user@host$ root用户的提示是这种: user ...
- jquery,smarty,dedecms的插件思路------dede未实践
1.jquery定义一个新函数,这个函数可以使用jquey的所有功能 2.smarty,dede其实也和jquery一样,不过是可以使用系统的一些方法而已 3.可能还有一些规范,如smarty插件的命 ...
- python opener代理
链接:http://www.jb51.net/article/46495.htm https://www.cnblogs.com/cunyusup/p/7341829.html
- tableView的cell显示不全的问题
如果是最上面的cell没有显示完整 1.重新设置tableview的frame: 例如你的搜索框高度为50,那么设置self.tableview.frame= CGRectMake(0,50,self ...
- iOS开发 两个内存错误的一般处理方法
本文转载至 http://blog.sina.com.cn/s/blog_a843a8850101dxlj.html 由于iOS5.0之前没有自动应用计数机制,也没有Java那样的垃圾回收功能.我们都 ...
- UIWebView使用中的内存相关问题
本文转载至: http://blog.csdn.net/musou_ldns/article/details/7675589 applicationios5webkit测试cacheios 在iO ...
- nexus-2.11.4-01-bundle.tar.gz 下载地址
wget http://sonatype-download.global.ssl.fastly.net/nexus/oss/nexus-2.11.4-01-bundle.tar.gz 注意原本的是ht ...