《事件和事件处理》PPT课件.ppt

JavaScript程序设计,第五章事件和事件处理,5.1理解事件,事件概述事件是浏览器响应用户操作的机制，说明了用户与Web页面交互时产生的操作。事件可以向浏览器表明有操作发生，需要浏览器处理。浏览器可以监听事件，在事件发生时做出反应，进行相应的处理工作。这种监听、响应事件并进行处理的过程被称为事件处理。有些事件可以被浏览器自动监听，由浏览器自动触发，例如：窗体的load事件。有些事件是用来执行某段代码以响应用户请求的，由人工编写程序进行定义的，当特定的事件发生时，执行这个事件对应的代码，以完成预期的事件处理。在JavaScript中，事件分很多种，如鼠标事件，键盘事件，HTML事件，变动事件,5.2鼠标事件,鼠标事件:单击过程中，拖标事件是指鼠标状态的改变，包括鼠标在移动过程中动过程中等所有鼠标状态改变都会触发事件。常用的鼠标事件有onclick单击事件，ondbClick双击事件，onmouseout鼠标离开事件，onmouseover鼠标移到上方事件，onmouseup鼠标放开按键事件，onmousedown鼠标按下事件,5.2.1onclick单击事件,Onclick事件在鼠标单击某表单域时触发。单击是指鼠标停留在对象上，按下鼠标按键，没有移动鼠标而放开鼠标按键这一完整过程。例如要求单击“保存”按钮时，提交当前表单Functionbtnsave（）document.form0.submit();,5.2.2ondblClick双击事件,ondblClick事件在鼠标双击某表单域时触发，双击事件是在较短时间内连接两次完成鼠标点击。,5.2.3onmouseover鼠标移动到上方事件,Onmouseover事件在鼠标进入对象范围（移到对象上方）时触发。例如：当鼠标进入单元格时，触发onmouseover事件，调用名称为modStyle的事件处理函数完成单元格样式的改变，onmouseover事件可以应用在所有的html元素中。例如：鼠标没有经过上面,5.2.4onmouseout鼠标离开事件,Onmouseout事件在鼠标离开对象时触发。Onmouseout通常和onmouseover共同改变对象的状态鼠标没在上面,onmousedown鼠标按下事件onmousedown事件在用户把鼠标放在对象上按下鼠标标使触发。onmouseup鼠标放开按键事件onmouseup事件在用户把鼠标放在对象上鼠标按键被按下的情况下，放开鼠标时触发。如果接收鼠标按下事件的对象与鼠标键放开时的对象不是同一个对象，那么onmouseup事件不会触发。,5.2.5鼠标按下和放开事件,5.2.6onselect选中事件,onselect事件在文本框或是文本域的内容被选中时（选中部分高亮显示）触发。onselect事件的具体过程是从鼠标按键被按下，到鼠标开始移动并选择内容的过程。这个过程并不包括鼠标键的放开。,5.3键盘事件,键盘事件是指键盘状态的改变。常用的键盘事件有onkeydown键盘事件，onkeypress按下键事件和onkeyup放开键事件,5.3.1onkeydown按键事件,Onkeydown事件在键盘的按键被按下时触发。Onkeydown事件用于接收键盘的所有按键（包括功能键）被按下时的事件。Onkeydown事件与onkeypress事件都在按键按下时触发，但是两者有区别。,5.3.2onkeypress按下事件,Onkeypress事件在键盘的按键被按下时触发。Onkeypress事件与onkeydown事件两者有先后顺序，onkeypress事件是在onkeydown事件之后发生的。此外当按下任何任何按键时都会触发onkeydown事件；但是onkeypress事件只在按下键盘的任一字符键（如A-Z数字键）是触发，但是单独按下功能键，ctrl键，shift键，alt键等不会触发onkeypress事件。,5.3.3onkeyup放开键事件,onkeyup事件在键盘的按键被按下然后放开时触发,5.4HTML事件,HTML事件是指HTML文件状态改变时触发，用户可以捕获的事件。,HTML常用事件,用户名:密码：,onsubmit实例代码onsubmittestfunctionsubmethod()varusername=document.getElementById(username).value;varpassword=document.getElementById(password).value;if(=username|=password)alert(用户名或密码空);returnfalse;elsereturntrue;,5.5变动事件,变动事件是指由于光标位置的改变引起的状态的改变。,