`

html input与textarea 值改变事件

阅读更多

// 文本输入框(input) 文本域(textarea)值改变事件

// onpropertychange(IE) oninput(w3c)

$('input,textarea').on('propertychange input', function(event) {

     console.log($(this).val())

});

 

事件顺序

  1. keydown 
  2. keypress
  3. propertychange / input
  4. keyup
  • keydown 阻止默认行为(event.stopPropagation())则 keypress ,propertychange/input不会发生.但keyup正常.
  • keypress 阻止默认行为则 propertychange/input不会发生.但keyup正常.
  • propertychange input 阻止默认行为 无改变.
  • propertychange 在IE9下 对 backspace无效
分享到:
评论

相关推荐

    input光标操作.html|input光标操作.html

    setSelectionRange方法用于设定<input> 或 <textarea> 元素中当前选中文本的起始和结束位置。 当opsStart和opsEnd相同时,可用于定位光标位置。 setSelectionRange实际上是改变了selectionStart 和 selectionEnd...

    angular-growing-input:允许textarea在用户输入值时更改其高度的指令

    不断增长的Input AngularJS指令此指令允许textarea增长到有限的高度。 jQuery FREE 。 只需要AngularJS。 该指令由@bgrins jQuery插件的化身制成。如何使用。 使用凉亭安装bower install angular-growing-input 包含...

    修改输入框placeholder文字默认颜色-webkit-input-placeholder方法

    html5为input添加了原生的占位符属性placeholder,高级浏览器都支持这个属性,例如: <input type="text" placeholder="搜索" value=" "> 默认的placeholder字体颜色是呈浅灰色,如果想改变这个默认颜色,解决...

    javaScript常用事件

    当利用text或textarea元素输入字符值改变时发该事件,同时当在select表格项中一个选项状态改变后也会引发该事件。例: <Form> <Input type="text" name="Test" value="Test" onCharge="check('this.test)"> ...

    html入门到放弃笔记

    3、属性的值 与 属性之间 使用 "=" 连接 4、一个元素允许有多属性,多属性间,排名不分先后,中间用 空格 隔开即可 Demo : 1、创建一个 div 标记 ,增加属性 ,设置 align 属性的值为 center ,设置 id 属性的...

    vue.js学习相关文件-测试代码

    input 和 textarea 元素中使用 v-model 实现双向数据绑定:test2/inputAndtextarea.html 两个按钮用于切换不同的列表布局:test2/layout.html 导航测试:test2/navigation.html 订单列表:test2/orderList.html 实时...

    文本框input聚焦失焦样式实现代码

    首先用css的伪类:focus可以改变。 文本框的 html代码假设如下: 代码如下: <dl> <dt>Name: <dt> <dd><input type=”text” /></dd> <dt>Password: <dt> <dd><input type=”password” /></dd> <dt>...

    HTML开发王

    3.1.4 属性值的定义 3.1.5 元素和属性的大小写规范 3.2 字符引用 3.2.1 字符数字引用 3.2.2 字符实体引用 3.3 使用注释 3.4 关于空白和空白字符 3.4.1 关于断行符 3.4.2 空白字符 3.5 基本html数据型式 3.5.1 cdata...

    详细分析React 表单与事件

    本章节我们将讨论如何在 React 中使用表单。 HTML 表单元素与 React 中的其他 DOM 元素有所不同,因为表单元素生来就保留一些内部状态。...在输入框值发生变化时我们可以更新 state。我们可以使用 onChange 事件来监听

    javascript 触发事件列表 比较不错

    1.单击事件___onclick 用户单击鼠标按键时产生的事件.同时onclick指定的事件...改变事件___onchange 当text或textarea元素内的字符值改变或select表格选项状态改变里发生该事件. 如;<textarea name=”liuyan” rows=

    从入门到精通HTML5——PDF——网盘链接

     14.1.2 增加与改良的input元素的种类 259  14.1.3 output元素的添加 264  14.1.4 应用新增元素制作注册表单 264  14.2 对表单的验证 266  14.2.1 自动验证 266  14.2.2 checkValidity显式验证法 267  14.2.3...

    一个基于jquery的页面表单草稿自动保存代码

    支持input type为 text,textarea,checkbox,radio,select,password,hidden的草稿自动保存 hidden的特殊性,因为hidden要手动触发change事件,当值改变的时候要 手动代码 .change() 触发一下才会保存相应的草稿 要实现...

    text-highlight:网页文本选中高亮(可多选,可跨块标签高亮)

    jsTextOperation 网页文本选中高亮,关键字搜索高亮 文本编辑元素中的文本选择(Input, TextArea) document.activeElement() 方法 跨标签文本选择 Selection 对象,window.getSelection() 方法

    详解maxlength属性在textarea里奇怪的表现

    HTML5给表单带来了很多改变,比如今天要说的maxlength,这个属性可以限制输入框输入的最大字字符数,更方便的是对于粘贴的内容也能够根据字符数自动截断。 最近就接到这要一个需求,限制用户最多输入600字(汉字和...

    利用HTML、CSS 实现带表情的评论框的制作教程

    HTML带表情的评论框,表情通过Json数据加载,可以根据自己的喜好改变表情。本评论框代码为HTML,CSS,JQ三个方面的代码。图1为原始状态,图2为点击表情时出现的表情列表,可以任意选择一个或者多个。下面我们来看看...

    css笔记课程笔记2019,5,22

    ** 使用标签把要操作的数据包起来,通过修改标签的属性值来实现标签内数据样式的变化 *** <font size="5"></font> 2、图像标签 图片的路径"/> ** 通过html访问本地图片,使用绝对路径,目前有问题 3、...

    js动态添加表格逐行添加、删除、遍历取值的实例代码

    关于js对表格进行逐行添加,今天抽空整理了一下:新建一个html文件(没有编辑器的可以新建一个demo.txt文件,然后改后缀名为demo.html),把下面代码全部贴进去即可。 功能包括:表格添加一行,表格删除一行,表格...

    正则表达式

    JavaScript的RegExp对象和String对象定义了使用正则表达式来执行强大的模式匹配和文本检索与替换函数的方法. 在JavaScript中,正则表达式是由一个RegExp对象表示的.当然,可以使用一个RegExp()构造函数来创建RegExp...

Global site tag (gtag.js) - Google Analytics