Javascript事件的入门知识
Javascript事件是用户访问Web页面引起的一系列操作;例如,用户单击;当用户执行某些操作时,用户执行一系列代码。
对事件的介绍
事件通常用于浏览器和用户操作之间的交互。他们第一次出现在伊江和Netscape导航器是共享服务器负载的一种方式。
的DOM2级规范开始尝试以逻辑方式DOM事件规范;
IE9 / / / Firefox Opera Safari和Chrome已经完全实现的核心部分DOM2级事件模块。
浏览器仍采用其专有的事件模型在IE8;
在Javascript三种事件模型:内联模型/脚本模型和DOM2模型;
两个内联模型(HTML事件处理程序)
这个模型是处理事件的最传统和最简单的方法。
在内联模型中,事件处理函数是HTML标签的属性,它用于处理指定的事件;
虽然内联在早期使用得更多,但它与HTML混合,并没有从HTML中分离出来;
在HTML中,事件处理函数被用作执行js代码的属性。
注意单引号和双引号。
在HTML中,事件处理函数被用作执行js函数的属性;
js的执行功能;
PS:功能不应该放在在window.onload,所以它不能被看见。
三脚本模型(dom0级别的事件处理程序)
由于违反了html/内联模型和Javascript代码级分离原则;
我们可以处理Javascript中的事件,脚本模型是这样吗;
无功输入= document.getelementsbytagname(输入的){ 0 }; / /输入对象;
(input.onclick =功能){ / /匿名函数;
警报('lee);
}
通过匿名函数,可以直接触发相应的代码;
可以通过指定函数名分配方法来执行函数(赋值函数名称不带括号);
input.onclick =箱; / /指定事件处理程序的匿名函数;
input.onclick = null; / /删除事件处理程序;
四事件处理函数
可以处理事件中的事件:鼠标/键盘事件;
Javascript事件处理函数及其使用列表
当受事件处理函数影响的元素出现时
onabort图像时,图像加载中断;
onblur窗/框架/所有的表单对象当焦点离开对象;
变化的输入框/选择框或文本字段时,一个元素的值被改变,失去了焦点;
单击链接/按钮/形式/图像等对象,当用户单击对象;
鼠标双击链接/按钮/表单对象当用户双击对象;
ondragdrop窗口,当用户拖动一个对象浏览器窗口;
OnError窗/框架/所有的表单对象脚本中出现语法错误时;
onfocus窗/框架/所有形式的对象时,单击鼠标或聚焦鼠标移动到窗口或框架;
onkeydown文件/图像/链接/形式的键被按下时;
键盘文件/图像/连接/形式时,按下和松开按键;
onkeyup文件/图像/链接/形式时,松开钥匙;
在载体 / /图像框架集文档或图像加载;
在卸载文件体/框架集文档或框架集卸载;
当删除链接时链接图标;
当链接,当鼠标移动到链接;
该ONMOVE窗口当浏览器窗口移动;
复位按钮点击的OnReset形式形式的复位按钮;
onresize窗口变小时浏览器窗口时;
onselect表单元素当选择一个对象;
onsubmit形式向服务器发送的形式时;
对于每个事件,它触发了作用域和模式,事件处理将失败;
1。鼠标事件,页面的所有元素都可以触发。
(1)单击:当用户单击鼠标按钮或按下返回键时;
input.onclick =函数(){
警报('lee);
};
(2)。Dblclick:当用户双击鼠标按钮来触发;
input.ondblclick =函数(){
警报('lee);
}
(3)。Mousedown:当用户按下鼠标并没有启动触发;
input.onmousedown =函数(){
警报('lee);
}
(4)触发MouseUp:当用户释放鼠标按钮;
input.onmouseup =函数(){
警报('lee);
}
(5).mouseover:触发器,当鼠标移动到某个元素。
input.onmouseover =函数(){
警报('lee);
}
(6)Mouseout:当鼠标移出触发某个元素。
input.onmouseout =函数(){
警报('lee);
}
(7)。Mousemove:触发时,鼠标指针移动的元素;
input.onmousemove =函数(){
警报('lee);
}
2。键盘事件
(1)。keyDown:当用户按下键盘上的任意键触发,如果持有,将重复触发;
化函数(){
警报('lee);
}
(2)。按键:当用户按下键盘上的字符键触发,如果持有,将重复触发;
键盘=函数(){
警报('lee);
}
(3)。Keyup:当用户释放键盘上的键的;
onkeyup =函数(){
警报('lee);
}
3.html事件
(1)加载:当页面被完全加载(包括所有外部资源(如Javascript文件/ CSS文件)时,窗口上的负载事件将被触发。
在window.onload =函数(){
警报('lee);
}
上面的图像也可以触发加载事件,无论它是DOM中的图像元素的图像元素还是HTML中的图像元素;
因此 /可以HTML的任何图像指定onload事件处理程序;
在下载之前,新的图像元素不会被添加到文档中,只要下载开始设置SRC属性;
元素也将触发加载事件,以允许开发人员确定动态加载Javascript文件是否加载;
具有不同设置的图像,仅在元素的SRC属性中并将其添加到文档中,将开始下载Javascript文件;
(2)卸载:当文档完全卸载并触发时;
只要用户从一个页面切换到另一个页面,就会有卸载事件;
使用此事件,而是最清楚的引用,以避免内存泄漏;
window.onunload =函数(){
警报('lee);
}
(3)选择:触发,当用户选择文本框(输入或文本)更改内容和失去焦点。
input.onselect =函数(){
警报('lee);
}
(4)。变化:被触发时,文本框中的内容(输入或文本)的变化和失去焦点。
input.onchange =函数(){
警报('lee);
}
(5)焦点:当页面或元素聚焦于窗口和相关元素时触发:此事件不冒泡;
input.onfocus =函数(){
警报('lee);
}
(6)Blur:当页面或元素失去对窗口和相关元素的关注时触发;这个事件不是冒泡的;
input.onblur =函数(){
警报('lee);
}
(7)提交:当用户单击提交按钮在元素上触发时;
form.onsubmit =函数(){
警报('lee);
}
(8)重置:当用户单击重置按钮在元素上触发时;
form.onreset =函数(){
警报('lee);
}
(9)调整大小:当浏览器窗口调整到一个新的高度或宽度时触发调整大小事件。
触发器上的窗口(窗口)中的事件;浏览器窗口最大化或最小化将触发调整大小事件;
浏览器中的Chrome和Opera将连续更改事件大小;
Firefox只有当用户停止调整窗口大小时才会触发调整大小事件;
window.onresize =函数(){
警报('lee);
}
(10)滚动条:当用户滚动滚动条的元素以触发;
window.onscroll =函数(){
警报('lee);
}