input 标签的监听事件总结

news/2024/7/11 0:11:29 标签: javascript, 前端, es6

最近在写一个手机端提交表单的项目,里面用了不少input标签,因为项目不太忙,所以,想做的完美点,但是遇到了一些问题,比如:页面中的必填项如果有至少一项为空,提交按钮就是不能提交的状态,所以需要对所有的input内容进行监听,刚开始我用了jquery的keyup事件解决问题,但是后来测试出一个bug,如果用户选择粘贴复制的话,keyup事件不能触发,也就不能通过判断input内容来改变提交按钮的状态。下面就这种问题做下总结,希望对自己和他人以后能有点帮助。

1.onfocus 当input 获取到焦点时触发

2.onblur 当input失去焦点时触发,注意:这个事件触发的前提是已经获取了焦点再失去焦点的时候会触发相应的js

3.onchange 当input失去焦点并且它的value值发生变化时触发

4.onkeydown 在 input中有键按住的时候执行一些代码

5.onkeyup 在input中有键抬起的时候触发的事件,在此事件触发之前一定触发了onkeydown事件

6.onclick 主要是用于 input type=button,当被点击时触发此事件

7.onselect 当input里的内容文本被选中后执行一段,只要选择了就会触发,不是非得全部选中

8.oninput 当input的value值发生变化时就会触发,不用等到失去焦点(与onchange的区别)

以上事件可以直接放到input的属性里,例如:,也可以通过js给input
dom元素添加相应的事件,如:

javascript">document.getElementByTagName('input').onfocus = function();

在这里插入图片描述


http://www.niftyadmin.cn/n/1371623.html

相关文章

LeetCode-199. 二叉树的右视图

LeetCode-199. 二叉树的右视图 难度:中等 给定一个二叉树的 根节点 root,想象自己站在它的右侧,按照从顶部到底部的顺序,返回从右侧所能看到的节点值。 //思路:保存层序遍历的最右端的值即可 class Solution { publi…

算法练习 找到数组中出现次数最多的数

思路: 1.对象可以自定义key,可以把要查询的数组离得每一个元素当成一个key保存起来, 2.判断如果key一样的话就(说明这个数组里面已经有了这个元素)就让他1,如果key不一样的话(说明这个对象没有这个元素)就给…

QT的QObject禁用拷贝构造和赋值运算符原因

QT的QObject禁用拷贝构造和赋值运算符原因 QObject禁用复制构造函数和赋值运算符源于它的性质: 具有唯一的QObject :: objectName。 Qt对象可以拥有自己的名称,objectName属性保存对象的名称。 那么复制一个Qt对象,如何处理新的对象的名字&am…

算法练习 找出素组中第三大的

思路1:这个思路太复杂了,运行起来耗性能,就是找到数组中最大的把他踢出去形成一个新的数组,再在新的数组中把最大的踢出去,形成一个新的数组,然后再找最大的就是第三个大的,不仅把方法写死了而且…

浏览器渲染HTML页面

构建DOM树 构建CSSOM 构建DOM和CSSOM是同时进行的

面试题:预编译

每次进行变量提升和函数提升时他们都要进入一个栈空间(上下文栈) 变量会先入栈函数会后入栈,出栈的时候就是函数先出栈,所以定义的函数会覆盖掉定义的变量

面试题:手写PromiseAll

function MypromisrAll(list) {return new Promise((reslove, reject) > {let reslist []let num 0//遍历给的数组并且执行他们的then获取他们返回的信息list.forEach(item > {item.then((res) > {reslist.push(res)numif (num list.length) {reslove(reslist)}})}…