您的位置:首页 > Web前端 > JavaScript

js学习笔记——事件

2013-03-30 21:54 218 查看
js实现交互主要通过事件模型实现,事件处理模型主要有三种:原始事件模型、标准事件模型和Internet Explorer事件模型。

原始事件模型——这是一种简单的事件处理模式,响应事件时调用事件句柄名,可移植性强,所有启动js的浏览器都支持;

标准事件模型——具有完整性,除IE以外的所有浏览器都支持;

Internet Explorer事件模型——IE浏览器专用。

一、原始事件模型:

1、常用的句柄属性:

onabort句柄——图像装载被中断——<img>标记支持;

onchange——选中<select>元素中的选项或其他表单元素失去了焦点,并且由于获得焦点而使值发生改变——<input>、<select>、<textarea>

onclick——点击事件

ondbclick——双击事件

onfocus——元素得到输入焦点——<button>、<input>、<lable>、<select>、<textarea>、<body>\

onkeykown——键盘键被按下,返回false取消默认动作——表单元素和<body>

onkeypress——键盘键被按下后释放,返回false取消默认动作——表单元素和<body>

onkeyup——键盘键被按下后释放——表单元素和<body>

onload——文档装载完毕——<body>、<frameset>、<img>

onmousemove

onmousedown

onmouseover

onmouseout

onreset——表单请求重置,返回false阻止重置——<form>

onresize——调整窗口大小——<body>、<frameset>

onselect——选中文本——<input>、<textarea>

onsubmit——请求提交表单,返回false阻止提交——<form>

onunload——卸载文档或帧集——<body>/<frameset>

2、在事件句柄中,关键字this引用发生事件的对象;

3、显示调用事件句柄:由于js事件句柄属性的值是函数,因此可以用js直接调用事件处理函数,如使用<form>的属性onsubmit定义一个表单验证函数,

并想在用户提交之前的某个时刻验证表单,那么可以使用Form对象的onsubmit属性来调用那个事件处理函数。

document.myform.onsubmit();


4、事件句柄返回值:如表单提交验证,用户没有填写时,阻止提交:

<form action="search.do" onsubmit="if(this.elements[0].value.length==0) return false;">
<input type="text">
</form>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: