DOM事件类型总结大全
unload:事件在用户退出页面时发生
window.onload = function(){
return "页面关闭!";
};
onblur:失去焦点发生变化
window.onblur = function(){
inp.value = inp.value.toUppercase();
};
onfocus:点击文本框会获得焦点发生
inp.focus = function(){
alert('弹出的内容');
};
onselect:要选中文本框中的内容会执行的事件
inp.onselect = function(){
alert('要执行的内容');
};
onchange:事件会在域的内容发生改变时发生
inp.onchange = function(){
alert('要执行的内容');
};
onreset:当点击重置的时候才会发生
form.onreset = function(){
//点击重置,是form;
};
onsumbit:点击提交
form.onsumbit = function(){
alert('要执行的内容');
};
onresize:当窗口发生大小变换的时候就会执行
window.onresize = function(){
alert('要执行的内容');
};
scrollBy、scrollTo:相对于自己之前的位置发生偏移,一个x一个y轴为参数
function scroll(){
window.scrollBy(100,100);
window.scrollTo(100,100);//绝对,固定
};
ondbclick:双击发生变化
inp.ondbclick = function(){
inp.value = "我双击了";
};
onclick:点击发生变化
inp.onclick = function(){
inp.value = "我点击了";
};
onmouseover:鼠标经过会发生变化,类似hover效果
inp.onmouseover = function(){
inp.value = "我鼠标滑过了";
};
onmouseout:鼠标移除会发生变化
inp.onmouseout = function(){
inp.value = "我鼠标移除来了了";
};
onmousedown:鼠标按键按下去会发生变化
inp.onmousedown = function(){
inp.value = "我鼠标按下来了";
};
onmouseup:按键按下去并释放松开会发生变化
inp.onmouseup = function(){
inp.value = "我鼠标按下并释放了";
};
onkeydown:按下键盘去会发生变化
inp.onkeydown = function(){
inp.value = "我按下键盘了";
};
onkeyup:按下键盘去会发生变化
inp.onkeyup = function(){
inp.value = "我松开键盘了";
};
DOM事件类型总结大全的更多相关文章
- 深入理解DOM事件类型系列第二篇——键盘事件
× 目录 [1]类型 [2]顺序 [3]按键信息[4]应用 前面的话 鼠标和键盘是电脑端主要的输入设备,上篇介绍了鼠标事件,本文将详细介绍键盘事件 类型 键盘事件用来描述键盘行为,主要有keydown ...
- DOM事件类型详解
一.表单事件: input事件当<input>.<textarea>的值发生变化时触发.此外,打开contenteditable属性的元素,只要值发生变化,也会触发input事 ...
- 深入理解DOM事件类型系列第一篇——鼠标事件
× 目录 [1]类型 [2]顺序 [3]坐标位置[4]修改键[5]相关元素[6]鼠标按键[7]滚轮事件[8]移动设备 前面的话 鼠标事件是web开发中最常用的一类事件,毕竟鼠标是最主要的定位设备.本文 ...
- 深入理解DOM事件类型系列第五篇——文本事件
× 目录 [1]change [2]textInput [3]input[4]propertychange[5]兼容 前面的话 如果DOM结构发生变化,触发的是变动事件:如果文本框中的文本发生变化,触 ...
- 深入理解DOM事件类型系列第四篇——剪贴板事件
× 目录 [1]定义 [2]对象方法 [3]应用 前面的话 剪贴板操作可能看起来不起眼,但是却十分有用,可以增强用户体验,方便用户操作.本文将详细介绍剪贴板事件 定义 剪贴板操作包括剪切(cut).复 ...
- 深入理解DOM事件类型系列第三篇——变动事件
× 目录 [1]删除节点 [2]插入节点 [3]特性节点[4]文本节点 前面的话 变动(mutation)事件能在DOM中的某一部分发生变化时给出提示,这类事件非常有用,但都只能使用DOM2级事件处理 ...
- 深入理解DOM事件类型系列第六篇——加载事件
前面的话 提到加载事件,可能想到了window.onload,但实际上,加载事件是一大类事件,本文将详细介绍加载事件 load load事件是最常用的一个事件,当页面完全加载后(包括所有图像.java ...
- 深入理解DOM事件类型系列——剪贴板事件
定义 剪贴板操作包括剪切(cut).复制(copy)和粘贴(paste)这三个操作,快捷键分别是ctrl+x.ctrl+c.ctrl+v.当然也可以使用鼠标右键菜单进行操作 对象事件 关于这3个操作共 ...
- d3.js:数据可视化利器之 交互行为:响应DOM事件
selection.on:事件监听操作符 on()操作符可以添加或移除选择集中每个 DOM元素的事件监听函数: selection.on(type[,listener[,capture]]) 参数ty ...
随机推荐
- 远程SSH连接服务与基本排错
为什么要远程连接Linux系统?? 在实际的工作场景中,虚拟机界面或物理服务器本地的窗口都是很少能够接触到的,因为服务器装完系统后,都要拉到IDC机房托管,如果是购买了云主机,更碰不到服务器本地显示器 ...
- java.net.SocketException: Broken pipe 异常可能的原因
org.apache.catalina.connector.ClientAbortException: java.net.SocketException: Broken pipe at org.apa ...
- CentOS_5.6下使用cmake编译MySQL_5.5.11
MySQL 最新的版本5.5.11需要cmake编译安装,估计以后的版本也会采用这种方式,网上找了一些安装方法有些地方是错的,自己整理一份 所以特地记录一下安装步骤及过程,以供参考!1 mysql 5 ...
- 2017TSC世界大脑与科技峰会,多角度深入探讨关于大脑意识
TSC·世界大脑与科技峰会是全世界范围内的集会,多角度深入探讨关于大脑意识体验来源这一根本话题,我们是谁,现实的本质是什么,我们所处宇宙空间的本质为何.该峰会由亚利桑那大学意识研究中心主办. 会议时间 ...
- react native 升级到0.31.0的相关问题 mac xcode开发环境
cmd + D和cmd + R快捷键没有反应 0.31.0版本换了一种加载方式,通过修改userDefaults达到debug目的 [userDefaults setObject:@"127 ...
- HttpClient--HttpGet使用
最近公司在做一个爬虫工具,爬取公司现网的数据,留给方通项目使用 用到里阿帕奇的这两个类,在网上看到了一些资料结合自己的应用,这个贴出一个demo import com.alibaba.fastjson ...
- redis多数据库操作
redis下,数据库是由一个整数索引标识,而不是由一个数据库名称.默认情况下,一个客户端连接到数据库0. redis配置文件中下面的参数来控制数据库总数: databases 16 [root@M ...
- Maven工具的介绍,配置及使用
--------均是在Windows操作系统下,不是之前的Linux操作系统------- 1.Maven的介绍 Maven项目对象模型(POM),可以通过一小段描述信息来管理项目的构建,报告和文档的 ...
- aync await 进一步探索
aync await 进一步探索 首先来个例子 class Program { static int index = 1; static void Log(string str) { Console. ...
- Centos程序最小化后,窗口标签都消失找不到窗口的问题
我是用的centos版本是CentOs 7. 在“顶部面板”或者 “底部面板” 右击选择“添加组件”),如下图所示: 在搜索框里输入“窗口列表”(window list),选中“窗口列表”即可.如下图 ...