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事件类型总结大全的更多相关文章

  1. 深入理解DOM事件类型系列第二篇——键盘事件

    × 目录 [1]类型 [2]顺序 [3]按键信息[4]应用 前面的话 鼠标和键盘是电脑端主要的输入设备,上篇介绍了鼠标事件,本文将详细介绍键盘事件 类型 键盘事件用来描述键盘行为,主要有keydown ...

  2. DOM事件类型详解

    一.表单事件: input事件当<input>.<textarea>的值发生变化时触发.此外,打开contenteditable属性的元素,只要值发生变化,也会触发input事 ...

  3. 深入理解DOM事件类型系列第一篇——鼠标事件

    × 目录 [1]类型 [2]顺序 [3]坐标位置[4]修改键[5]相关元素[6]鼠标按键[7]滚轮事件[8]移动设备 前面的话 鼠标事件是web开发中最常用的一类事件,毕竟鼠标是最主要的定位设备.本文 ...

  4. 深入理解DOM事件类型系列第五篇——文本事件

    × 目录 [1]change [2]textInput [3]input[4]propertychange[5]兼容 前面的话 如果DOM结构发生变化,触发的是变动事件:如果文本框中的文本发生变化,触 ...

  5. 深入理解DOM事件类型系列第四篇——剪贴板事件

    × 目录 [1]定义 [2]对象方法 [3]应用 前面的话 剪贴板操作可能看起来不起眼,但是却十分有用,可以增强用户体验,方便用户操作.本文将详细介绍剪贴板事件 定义 剪贴板操作包括剪切(cut).复 ...

  6. 深入理解DOM事件类型系列第三篇——变动事件

    × 目录 [1]删除节点 [2]插入节点 [3]特性节点[4]文本节点 前面的话 变动(mutation)事件能在DOM中的某一部分发生变化时给出提示,这类事件非常有用,但都只能使用DOM2级事件处理 ...

  7. 深入理解DOM事件类型系列第六篇——加载事件

    前面的话 提到加载事件,可能想到了window.onload,但实际上,加载事件是一大类事件,本文将详细介绍加载事件 load load事件是最常用的一个事件,当页面完全加载后(包括所有图像.java ...

  8. 深入理解DOM事件类型系列——剪贴板事件

    定义 剪贴板操作包括剪切(cut).复制(copy)和粘贴(paste)这三个操作,快捷键分别是ctrl+x.ctrl+c.ctrl+v.当然也可以使用鼠标右键菜单进行操作 对象事件 关于这3个操作共 ...

  9. d3.js:数据可视化利器之 交互行为:响应DOM事件

    selection.on:事件监听操作符 on()操作符可以添加或移除选择集中每个 DOM元素的事件监听函数: selection.on(type[,listener[,capture]]) 参数ty ...

随机推荐

  1. 腾讯云无法绑定公网IP问题解释与解决方案。

    http://blog.csdn.net/chenggong2dm/article/details/51475222 解释:公网IP并不直接配置在服务器上,而是在服务器外部的路由上,通过某种映射连接. ...

  2. Oracle学习历程--创建用户,分配表空间

    记录下学习Oracle12c的过程中的点点滴滴. Oracle12c新特性:http://www.cnblogs.com/kerrycode/p/3386917.html --创建临时表空间CREAT ...

  3. AspNetCore-MVC实战系列(三)之个人中心

    AspNetCore - MVC实战系列目录 . 爱留图网站诞生 . git源码:https://github.com/shenniubuxing3/LovePicture.Web . AspNetC ...

  4. 【算法系列学习】SPFA邻接表最短路 [kuangbin带你飞]专题四 最短路练习 F - Wormholes

    https://vjudge.net/contest/66569#problem/F 题意:判断图中是否存在负权回路 首先,介绍图的邻接表存储方式 数据结构:图的存储结构之邻接表 邻接表建图,类似于头 ...

  5. nodejs版本管理工具NVM(Node Version Mene)

    最近打算用心学习nodejs,所以在学习中了解到NVM-nodejs的版本管理工具,下面我就记录下我学习并且安装的详细过程,请大神们放过~~第一步.你要先把你本机上安装的nodejs以及npm相关的东 ...

  6. ST-1之乱码bug

    我印象最深刻的一个错误就是乱码.上学期末做web期末作业时候,我就遇到了好多乱码问题.乱码问题并不是程序本身的逻辑错误,但是却让程序的可用性非常的差.只有输入英文时才能判断结果的正确与否.而且编译器又 ...

  7. linux-redhat-iso 下载

    http://archive.download.redhat.com/pub/redhat/linux/9/en/iso/i386/ http://www.jb51.net/do/plus/downl ...

  8. maven的三大生命周期

    一.Maven的生命周期 Maven的生命周期就是对所有的构建过程进行抽象和统一.包含了项目的清理.初始化.编译.测试.打包.集成测试.验证.部署和站点生成等几乎所有的构建步骤. Maven的生命周期 ...

  9. ucenter 单点登录,终极版

      一 ,discuz ecshop  两边登陆都可以同步登陆到另一程序上,但退出则无法实现同步登陆.顺着 Ecshop 的退出流程,顺藤摸瓜找到了 lib_common.php 文件中的 uc_ca ...

  10. Javascript开发技巧(JS中的变量、运算符、分支结构、循环结构)

    一.Js简介和入门 继续跟进JS开发的相关教程. <!-- [使用JS的三种方式] 1.HTML标签中内嵌JS(不提倡使用): 示例:<button onclick="javas ...