监听输入框变化(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 ...
随机推荐
- Swift初窥----语法进阶
缺省绑定(Optional Binding 自己主动置空) 通过在类型变量后,加上?,能够实现缺省绑定为nil var window: UIWindow? 就是说,假设不正确window赋值,则win ...
- Centos7 安装 Maven 3.5.*
下载 Apache Maven 访问 Maven官方网站,打开后找到下载链接,如下: 解压 tar zxvf apache-maven-3.5.3-bin.tar.gz 添加环境变量 打开 /etc/ ...
- 动态PPT制作
今天开通的博客,希望以后能够和大家一起分享学习心得.今天也是第一次学习制作动态PPT. 如果想要做成flash那种效果,建议学习下<动画传奇>这本书. 做成flash效果,需要用到动画中的 ...
- Android fragment (二)
怎样使用fragment? 1.首先你要确定下你有多少个fragment要使用在一个activity里. 2.依据你的fragment的数量,创建继承自fragment的class.然后依据实际需求重 ...
- ALLEGRO修改位号回注ORCAD原理图
资料:ALLEGRO修改位号回注ORCAD原理图 https://wenku.baidu.com/view/54e221e114791711cd7917e2.html?re=view
- hdu1081 最大子矩阵
最大子矩阵自然直在最大连续子序列的升级版 只是其原理都是用到了动态规划思想 仅仅是矩阵用到了枚举 +合并 把非常多列看成是一列的和 #include<stdio.h> ...
- 一个数组nums,其中任意两个值等于给定值target,返回这两个值在nums里的位置
package com.java.tencent; import java.lang.reflect.Array; import java.util.Arrays; import java.util. ...
- python学习(十二)模块
怎么一下子就来学了模块? 其实学了判断.循环.函数等知识就可以开始下水写程序了,不用在意其他的细节,等你用到的时候再回过头去看,此所谓囫囵吞枣学习法. 为啥学模块? 有点用的.或者有点规模的程序都是要 ...
- vim与sublime
vim与sublime 对程序员来说,写代码是再熟悉不过的事情了,windows系统自带有记事本软件,能写写小规模的代码,可是代码量大了,它的局限性就暴露得很明显了:没有语法高亮,没有自动提示,不支持 ...
- Javascript文件加载:LABjs和RequireJS
传统上,加载Javascript文件都是使用<script>标签. 就像下面这样: <script type="text/javascript" src=&quo ...